Keskustelu: Nettisivujen teko: Javascript for loopin (onload) pysäytys

jyp65 [30.11.2011 00:13:13]

Käynnistän seuraavalla koodilla layerien piilotus- ja esiintuomistoimet (vaihtuvat kuvat). Napit tasoilla ovat painikkeet, joista kuvien välillä pitäisi pystyä vaihtamaan suoraan ohi tämän body komennon yhteydessä onload komennolla ladattavan funktion. Eli tämä pitäisi pystyä jotenkin pysäyttämään kun painiketta painetaan (toimii muuten, mutta jatkaa showLayers funktiota).

<script type="text/javascript">

function showLayers(){

var a=24000;

for (i=0; i < 1000; i++){

var y=a*i;
setTimeout("document.getElementById('kuva1').style.visibility='visible'",0+y);

setTimeout("document.getElementById('kuva1').style.visibility='hidden'",8000+y);
setTimeout("document.getElementById('kuva2').style.visibility='visible'",8000+y);
setTimeout("document.getElementById('napit2').style.visibility='visible'",8000+y);

setTimeout("document.getElementById('kuva2').style.visibility='hidden'",16000+y);
setTimeout("document.getElementById('napit2').style.visibility='hidden'",16000+y);
setTimeout("document.getElementById('kuva3').style.visibility='visible'",16000+y);
setTimeout("document.getElementById('napit3').style.visibility='visible'",16000+y);

setTimeout("document.getElementById('kuva3').style.visibility='hidden'",24000+y);
setTimeout("document.getElementById('napit3').style.visibility='hidden'",24000+y);

}
}
</script>

Mod. lisäsi kooditagit!

Metabolix [30.11.2011 00:28:52]

Luot siis sivun latautuessa valmiiksi 10000 timeouttia? Ihan mieletöntä purkkaa. Mikset toteuta koko hommaa vaikka näin:

var vaiheita = 3;
var vaihe = 0;
var seuraava_timeout = null;
function nayta() {
  if (vaihe == 0) {
    // Piilota ja näytä oikeat asiat.
  }
  // if (vaihe == 1) jne.
}
function seuraava() {
  seuraava_timeout = setTimeout(seuraava, 8000);
  vaihe = (vaihe + 1) % vaiheita;
  nayta();
}
function kaynnista() {
  if (!seuraava_timeout) {
    seuraava_timeout = setTimeout(seuraava, 8000);
  }
}
function pysayta() {
  if (seuraava_timeout) {
    clearTimeout(seuraava_timeout);
    seuraava_timeout = null;
  }
}
window.onload = function() {
  nayta();
  kaynnista();
};

Pysäytys- ja käynnistysnapit osaat varmaan tuon pohjalta tehdä, kun on valmiit funktiotkin annettu.

jlaire [30.11.2011 06:48:00]

En jaksa ymmärtää mitä ollaan tekemässä, mutta ainakin säännöllisin väliajoin tehtävät setTimeoutit kannattaa korvata setIntervalilla.

jyp65 [30.11.2011 08:55:35]

Kiitos Metabolix. Sain toimimaan...

Vastaus

Aihe on jo aika vanha, joten et voi enää vastata siihen.

Kirjautuminen