Javascript Text Slideshow

JavaScript ve/veya jQuery'yi kullanarak bir div'a metin eklemeye çalışıyorum ve daha sonra her 10 saniyede bir metne dönüşmesini sağlayın - böylelikle sadece düz metnin bir slayt gösterisi gibi. İşte benim kod:Javascript Text Slideshow

<div id="textslide"><p></p></div> 

<script> 

var quotes = new Array(); 

quotes[0] = "quote1"; 
quotes[1] = "quote2"; 
quotes[2] = "quote3"; 
quotes[3] = "quote4"; 
quotes[4] = "quote5"; 

var counter = 0; 

while (true) { 
    if (counter > 4) counter = 0; 
    document.getElementById('textslide').firstChild.innerHTML = quotes[counter]; 
    counter++; 
    setTimeout(// not sure what to put here, 500); // Want to delay loop iteration 
} 

</script>

kaynak

2013-09-28 RMi Flores

setTimeout' 'ilk arg bir işlevdir üzerinde diyoruz. 'setTimeout' basitçe bu fonksiyonu tekrarlı olarak çağırır. Bu durumda, js kodunu bir işleve koymanız ve sonra bu işlevin adını ilk argüman olarak yazmanız yeterlidir. – stackptr

HTML:

<div id="textslide"><p></p></div>

JavaScript/jQuery:

var quotes = [ 
    "quote1", 
    "quote2", 
    "quote3", 
    "quote4", 
    "quote5", 
    ]; 

var i = 0; 

setInterval(function() { 
$("#textslide").html(quotes[i]); 
    if (i == quotes.length) { 
     i = 0; 
    } 
    else { 
     i++; 
    } 
}, 10 * 1000);

Working demo here İşte

kaynak

2013-09-28 19:52:12

düz JS

ile bir öneridir

function loop() { 
    if (counter > 4) counter = 0; 
    document.getElementById('textslide').firstElementChild.innerHTML = quotes[counter]; 
    counter++; 
    setTimeout(loop, 500); 
} 
loop();

Demo here

Eğer jQuery kullanmak istiyorsanız bunu kullanabilirsiniz: $('#textslide p:first').text(quotes[counter]);

Demo here yerine süre içinde

kaynak

2013-09-28 19:53:00 Sergio

, kullanım:

setInterval(function() { 
    //do your work here 
}, 10000);

.210

kaynak

2013-09-28 19:53:25

_setIntervale_ değil, _setInterval_. –

bir işlevi kullanın ve vücut onload

<html> 
    <head> 
     <script> 
     var counter = 0; 

     function changeText() 
     { 
     var quotes = new Array(); 

     quotes[0] = "quote1"; 
     quotes[1] = "quote2"; 
     quotes[2] = "quote3"; 
     quotes[3] = "quote4"; 
     quotes[4] = "quote5"; 

     if (counter > 4) 
      { 
      counter = 0; 
      } 

     document.getElementById("textslide").innerHTML = quotes[counter]; 

     setTimeout(function(){changeText()},10000); 
     counter ++; 
     } 
     </script> 
    </head> 
    <body onload="changeText();"> 
     <p id="textslide"></p> 
    </body> 
</html>

kaynak

2013-09-28 20:07:35 Kobbe

Javascript Text Slideshow

cevap

İlgili konular