getElementsByClassName non funziona con gli Internet Explorer, quindi prova il mio esempio con altro Navigator; ma non è a questo metodo che siamo legati: lo scopo della function collect() è di "raccogliere", identificare gli Elementi (DIV) sui quali le ulteriori istruzioni JS dovranno intervenire.
Far avere ad essi degli ID in sede di echo PHP potrebbe essere una utile alternativa, così potremmo usare il metodo getElementById che è "universale" (dall' era di IE5 in avanti).
codice:
<!DOCTYPE html PUBLIC>
<html>
<head><title>BOES's multi-content Slider</title>
<script type="text/javascript">
var things;
function collect(){
things = document.getElementsByClassName('slide');
alert('ce ne sono ' + things.length);
rotate();
}
var theone = 0;
function rotate(){
things[theone].style.visibility='';
setTimeout('things[theone].style.visibility="hidden"; theone++; if( theone==things.length ){ theone=0; }; rotate();', 2000);
}
window.onload=collect;
</script>
<style type="text/css">
div {
border: 1px dashed blue;
}
</style>
</head><body>
<div class="contenitore">
<div class="slide" >[img][/img]<div class="testo">Primo testo </div></div>
<div class="slide" style="visibility:hidden">[img][/img]<div class="testo">Secondo testo</div></div>
<div class="slide" style="visibility:hidden">[img][/img]<div class="testo">Terzo testo </div></div>
<div class="slide" style="visibility:hidden">[img][/img]<div class="testo">Quarto testo </div></div>
</div>
</body>
</html>
Ora con le variabili:
things[0]
things[1]
things[2]
things[3]
JavaScript identifica i tuoi quattro DIV; il "trucco" è avere il numero indice tra le quadre [], che come tale, come numero tradotto dalla variabile theone, può essere accresciuto o riportato a zero da computazioni; e permettere così la "rotazione".
Originariamente inviato da BOES
....quindi arrivato alla fine dei div dentro il DIV CONTENITORE, reiniziasse da capo...
A questo provvede l' IF-statement che ti ho colorato in dark-red.
Rispondi quotando
