FAQ Drop Down script

Status
Not open for further replies.

JavaScriptBank

Right off the assembly line
Need to create a F.A.Q for your Web site? Use this JavaScript to hide/reveal content on a Web page. Keep your long documents short.... detail at JavaScriptBank.com - 2.000+ free JavaScript codes

*www.javascriptbank.com/javascript.images/utility/faq-drop-down-script.jpg
Demo: JavaScript FAQ Drop Down script

How to setup

Step 1: Place JavaScript below in your HEAD section
JavaScript
Code:
<script type="text/javascript">
<!-- Begin
// Created by: Fang :: *tinyurl.com/7v7l8

function toggle(obj) {
// Moz. or IE
var sibling=(obj.nextSibling.nodeType==3)? obj.nextSibling.nextSibling : obj.nextSibling;
// hide or show
if(sibling.style.display=='' || sibling.style.display=='block') {
	sibling.style.display='none';
    obj.firstChild.firstChild.data='+';
    }
else {
	sibling.style.display='block';
    obj.firstChild.firstChild.data='-';
    }
}
//
function initCollapse() {
var oDT=document.getElementById('content').getElementsByTagName('dt');
for (var i=0; i < oDT.length; i++) {
	oDT[i].onclick=function() {toggle(this)};
    var oSpan=document.createElement('span');
    var sign=document.createTextNode('+');
    oSpan.appendChild(sign);
    oDT[i].insertBefore(oSpan, oDT[i].firstChild);
    oSpan.style.fontFamily='monospace';
    oSpan.style.paddingRight='0.5em';
    oDT[i].style.cursor='pointer';
    toggle(oDT[i]);
	}
oDT=null;
}
window.onload=function() {if(document.getElementById && document.createElement) {initCollapse();}}
//-->
</script>
	<!--
    	This script downloaded from www.JavaScriptBank.com
    	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
	-->

Step 2: Place HTML below in your BODY section
HTML
Code:
<dl id="content">
    <dt>This is Question #1  <em class="sm">[click here]</em></dt>
      <dd>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam 
		nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat 
		volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation 
		ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. 
		Duis autem vel eum iriure dolor in hendrerit in.<br><br></dd>
    <dt>This is Question #2  <em class="sm">[click here]</em></dt>
      <dd>Ma quande lingues coalesce, li grammatica del resultant lingue es plu 
		simplic e regulari quam ti del coalescent lingues. Li nov lingua franca 
		va esser plu simplic e regulari quam li existent Europan lingues. It va 
		esser tam simplic quam Occidental: in fact, it va esser Occidental. A un 
		Angleso.<br><br></dd>
    <dt>This is Question #3  <em class="sm">[click here]</em></dt>

      <dd>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam 
		nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat 
		volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation 
		ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. 
		Duis autem vel eum iriure dolor in hendrerit in.</dd>
</dl>
</div>
	<!--
    	This script downloaded from www.JavaScriptBank.com
    	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
	-->






Javascript Music Player - Random Text Generator - Floating Image Script​
 
Status
Not open for further replies.
Top Bottom