Articoli / Javascript
Mostrare e Nascondere Elementi con HTML e Javascript
Author: Tafaz
Visits: 1368
Date: 29.10.2006
Per 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>
Author: Tafaz
Visits: 1368
Date: 29.10.2006
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>
Page 1 of 1
Se vuoi discutere con noi su questo articolo o comunque vuoi porci delle domande usa il nostro Forum
