Jquery show hide div

Con Jquery sono disponibili due comode funzione che si occupano di realizzare lo show/hide dinamico di un div:

• La funzione toggle;
• La funzione slideToggle che da un effetto "slide" all'animazione.

Di seguito un esempio

Codice javascript

function toggleDiv(divId) {
   $("#"+divId).slideToggle("slow");
   var v=$("#linkGuida").text();
  
   if(v=="Guida on-line"){
    $("#linkGuida").html("Nascondi guida on-line");
    }
   else
    {
    $("#linkGuida").html("Guida on-line");
    }
}

Codice html

<br/>
<a href="javascript:toggleDiv('qwerty');"   ><span id="linkGuida">Guida on-line</span></a>
<br/>
<div id="qwerty" style="display:none">
<fieldset>
<legend>
Nomenclatura 
</legend>
<ul>
  <li><b>BOT:</b> Buono ordinario del tesoro</li>
  <li><b>BTP:</b> Buono del tesoro pluriennale</li>
  <li><b>CTZ:</b> Obbligazione del tipo Zero Coupon (solo maxicedola finale)</li>
</ul>
</fieldset>

</div>
 

Vediamo l'esempio all'opera (cliccare sul link 'Guida on line')

Guida on-line

Nomenclatura

• BOT: Buono ordinario del tesoro
• BTP: Buono del tesoro pluriennale
• CTZ: Obbligazione del tipo Zero Coupon (solo maxicedola finale)