Home
- 291 voti - 1798 visitePer mostrare o nascondere un div (o un qualsiasi altro elemento HTML) contrassegnato da un id dobbiamo prima di tutto creare un puntatore all'oggetto per poi modificarne le proprietà.
Per fare questo creiamo la funzione getElement che ritorna il risultato di getElementById o document.all, in base al tipo di browser.
Una volta creato il puntatore andremo a modificare la proprietà visibility dell'oggetto impostandola a "visible" (visibile) se questa è impostata a "hidden" (nascosto), o viceversa a "hidden" se questa è impostata a "visible" o "" non impostata.
Ora vediamo il codice di questa semplice funzione
<script type="text/javascript"><!--
function getElement(id){
return (typeof document.getElementById != "undefined")?document.getElementById(id):document.all[id];
}
function showHide(id){
div = getElement(id);
div.style.visibility = (div.style.visibility=="" || div.style.visibility=="visible")?"hidden":"visible";
}
//--></script>
<div id="div1" style="visibility: visible;">
questo è il div che andiamo a mostrare / nascondere
</div>
<a href="javascript:;" onclick="showHide('div1');">Mostra / Nascondi</a>
Per fare questo creiamo la funzione getElement che ritorna il risultato di getElementById o document.all, in base al tipo di browser.
Una volta creato il puntatore andremo a modificare la proprietà visibility dell'oggetto impostandola a "visible" (visibile) se questa è impostata a "hidden" (nascosto), o viceversa a "hidden" se questa è impostata a "visible" o "" non impostata.
Ora vediamo il codice di questa semplice funzione
<script type="text/javascript"><!--
function getElement(id){
return (typeof document.getElementById != "undefined")?document.getElementById(id):document.all[id];
}
function showHide(id){
div = getElement(id);
div.style.visibility = (div.style.visibility=="" || div.style.visibility=="visible")?"hidden":"visible";
}
//--></script>
<div id="div1" style="visibility: visible;">
questo è il div che andiamo a mostrare / nascondere
</div>
<a href="javascript:;" onclick="showHide('div1');">Mostra / Nascondi</a>
Ritorna alla pagina Articoli
