+ 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 Réponses
+ 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
Vous avez souvent des questions comme celle-ci ?
Apprenez de manière plus efficace, gratuitement :
Aujourd'hui en vedette
Pig Latin
0 Votes
Someone can help me
0 Votes
Square Roots
0 Votes
What's wrong with this?
2 Votes
I’m new someone can help me
0 Votes
What's doctype htMl
2 Votes
HTML community, HELP!!
0 Votes