FAQ Drop Down script

JavaScriptBank

Bannato
26 Nov 2009
86
0
0
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


How to setup

Step 1: Copy & Paste JavaScript code below in your HEAD section
JavaScript
Codice:
<script type="text/javascript">
<!-- Begin
// Created by: Fang :: http://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
Codice:
<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
	-->






 
Discussioni simili
Autore Titolo Forum Risposte Data
J Una FAQ alla volta jQuery 1
B problema pagina faq PHP 3
M programma per creare video Faq Webdesign e Grafica 7
A implementazione faq Javascript 1
C faq HTML e CSS 5
grottafelix Faq: Do You Remember? Javascript 1
grottafelix Faq Grafica (desktop pubblishing) Webdesign e Grafica 0
peppoweb Cercasi script per Faq PHP 4
M Drag and Drop non capisco le sequenze... Javascript 1
M [PHP] Drop down in campo select PHP 1
M [PHP] Interrompere DROP TABLE con PDO PHP 0
L [Javascript] Drag and drop. Aggiornamento Campo Javascript 2
O Drop menu o menu a tendina HTML e CSS 5
S Problema drop-down box PHP 22
R Drop database jolly MySQL 1
J Jquery ui drag drop move jQuery 0
J Drop down menu HTML e CSS 0
G Piccolo problema con il Drag&Drop jQuery 0
M Creare un menu drop-down in app Android Sviluppo app per Android 1
P sito e-commerce drop shipping E-Commerce 3
S Selezionare files con drag and drop prima di upload PHP 0
A funzione per popolare un drop down list Javascript 4
A Drag and drop per ipad , questo sconosciuto... Javascript 1
R ordinamento immagini con drag and drop e memorizzazione db PHP 1
A copiare dati in mysql con drag & drop jQuery 0
P drag e drop disabilitato con jquery Javascript 1
max1974 grid e json con drag e drop jQuery 0
M Upload con drag and drop PHP 1
D Come posso rendere obbligatorio un drop down menu? Javascript 12
S AIUTO piccola modifica Drop Down Menu Javascript 0
D Menu Drop Down HTML e CSS 0
zighy memorizzare gli elementi di un drag n drop Javascript 4
zighy drag drop Javascript 11
F Drop Down Menu compatibile con internet explorer HTML e CSS 0
D Drag and drop immagini non compatibile con FF Javascript 1
D Drag & drop HTML5. Problema con ie e chrome! HTML e CSS 1
renegade Vendo Agenda prenotazioni sistema Drag & Drop Offerte e Richieste di Lavoro e/o Collaborazione 0
WorldWideWeb Drag&Drop su TreeView Visual Basic 0
L java,oggetti grafici e drag and drop Java 2
Trogo Mysql: Drop all tables MySQL 0
J Animated Drop Down Navigation Menu Javascript 0
J Drag and drop in vb Visual Basic 1
Z Recupero Values da Drop Down menu: Questioni PHP 0
N drag & drop Flash 1
U Aiuto per Drop Down Menu tre livelli PHP 0
G menu orizzontale drop-down HTML e CSS 0
E drag & drop Flash 1
X-Zeus Drop-Down Menu in php PHP 3
D drop down & flash Javascript 0
S errore nel compilare una drop down list ASP.NET 0

Discussioni simili