Download "Show/Hide content" script


Put this into your <HEAD> section

Put this example code into your <BODY> section

How to use

You define your questions and answers like this:
<div id="q1" class="question">- How does this work ?</div>
<div id="a1" class="answer">This is done by use of <divs> and altering the css attribute "display"</div>

I.e. two simple divs, where the first one got the id "q1" and the second one the id "a1". "1" indicates that this is the first question. Q&A number 2 should have the id "q2" and "a2". The first div should be assigned to the class "question" and the second one the "answer" class.

The script is initialized by the initShowHideContent() function. This function is executed as an window onload event. If you allready have a onload event, you could replace the line window.onload = initShowHideContent; with either <BODY onload="initShowHideContent()"> or a direct call to the function below your last q&a divs. example:
<SCRIPT type="text/javascript">


Mark E
How do I set expandMultiple to false?
Mark E at 06:13PM, 2011/03/12.
This doesn't seem to work in IE9. But works fine in FF 4 and Chrome (12.0.742.100). Thanks for the work, nice simple text slider.
Bluehound at 06:33PM, 2011/06/24.
When the first linked is clicked it's true that the first div is shown but when the second link is clicked the first div should hide and second div should show up. how come both are visible at the same time?
Sameer at 09:17AM, 2012/07/29.
Wow! I really liked this script, you are the best!
Athanase at 05:14PM, 2012/08/23.
thk for you help. good work.
Yves at 10:17AM, 2014/07/29.
Medication information. Long-Term Effects.
<a href="">where to buy generic pregabalin online</a> in Canada
Actual what you want to know about drug. Get information here.
QywUL at 10:41PM, 2021/04/24.

Post your comment

Don't have an avatar? Create one at

Confirmation code:

Go to

About/Contact | A good idea? | Submit a script | Privacy notice
© 2005 - 2021