New course! Every coder should learn Generative AI!
Try a free lesson+ 2
Read more
Hello I want to make a "read more" so when you click read more, the text expands but when you open an other read more the first text is going to hide agian
6 Answers
+ 5
I just made a simple code for you check it out .
https://code.sololearn.com/WWYluMnkrHdv/?ref=app
+ 1
Here is a basic concept of doing it. I'm not sure if you're limited to only JS and HTML, but you can do it much easier with jQuery, and can even easily animate it so it looks prettier. Throw a little CSS at it also, and it'll be less rigid.
Hope this helps.
HTML:
<button onclick="readMore()">Read More</button>
<div id="divReadMore">
This is stuff that I want you to read! So...read it!
</div>
<button onclick="readMore2()">Read Even More</button>
<div id="divReadMore2">
This is stuff that I want you to read!
</div>
JS:
function readMore() {
var x = document.getElementById('divReadMore');
var y = document.getElementById('divReadMore2');
if (x.style.display === 'none') {
x.style.display = 'block';
} else {
x.style.display = 'none';
}
if (y.style.display === 'block') {
y.style.display = 'none';
}
}
function readMore2() {
var x = document.getElementById('divReadMore2');
var y = document.getElementById('divReadMore');
if (x.style.display === 'none') {
x.style.display = 'block';
} else {
x.style.display = 'none';
}
if (y.style.display === 'block') {
y.style.display = 'none';
}
}
+ 1
The code that I posted was just an example for you. You can change the button element to whatever element you want. Most elements have the 'onclick' property that you can execute JS functions from easily.
SYNTAX:
<element onclick="script">
SUPPORTED HTML TAGS:
All HTML elements, EXCEPT: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style>, and <title>
0
Help
0
I do not want a button I want a text to click
0
It works, thanks all
Often have questions like this?
Learn more efficiently, for free:
Hot today
Problem
0 Votes
USING HTML ONLY!!!
5 Votes
Effects on HTML and JavaScript
0 Votes
Help. Помогите пожалуйста
1 Votes
Dark web access
1 Votes
Programming sickness
3 Votes