fare una presentazione in loop JavaScript jQuery senza

Possible Duplicate:
trying to create simple Slide show method in Javascript fare una presentazione in loop JavaScript jQuery senza

devo imparare a fare immagine carosello sceneggiatura presentazione con JavaScript. Penso che sia meglio impararlo dal basic piuttosto che creare qualcosa dal framework (instant script) ma sono un principiante. Scrivo questo copione usando la mia tecnica, ma penso che sia terribile.

OK, ecco la mia domanda: Non so come fare questo ciclo di presentazioni, chiunque può aiutarmi? Grazie

<!DOCTYPE html> 
<html> 
<head> 
    <style type="text/css"> 
     #wrapper { 
     width:400px; 
     height:140px; 
     position:absolute; 
     left:50%; 
     top:50%; 
     margin: -70px 0 0 -200px; 
     background: #383838; 
     overflow: hidden; 
     } 

     #abc-container { 
     position: absolute; 
     width:1200px; 
     height:140px; 
     } 

     #a { 
     width:400px; 
     height:140px; 
     background: #FF0000; 
     float: left; 
     } 

     #b { 
     width:400px; 
     height:140px; 
     background: #FFFF00; 
     float: left; 
     } 

     #c { 
     width:400px; 
     height:140px; 
     background: #00FFFF; 
     float: left;  
     } 
    </style> 
</head> 
<body> 
    <div id="wrapper"> 
     <div id="abc-container"> 
      <div id="a"></div> 
      <div id="b"></div> 
      <div id="c"></div> 
     </div> 
    </div> 
    <div id="asas"></div> 
    <div id="asass"></div> 
    <script type="text/javascript"> 
     var runCarousel, runTimer; 
     firstval = 0; 
     secondval = 0; 

     function Carousel(){ 
     firstval += 10; 
     document.getElementById('abc-container').style.left = "-" + firstval + "px"; 
     document.getElementById('asas').innerHTML = "-" + firstval; 
      if(firstval == 400) 
      { 
       StopRun(); 
       StartTimer() 
       return; 
      } 
      if(firstval == 800) 
      { 
       StopRun(); 
       StartTimer() 
       return; 
      } 
     runCarousel = setTimeout(Carousel, 10); 
     } 

     function StartTimer(){ 
     secondval += 1; 
     document.getElementById('asass').innerHTML = "-" + secondval; 
     if(secondval == 10) 
     { 
      StopTimer(); 
      Carousel(); 
      return; 
     } 
     if(secondval == 20) 
     { 
      StopTimer(); 
      Carousel(); 
      return; 
     } 
     runTimer = setTimeout(StartTimer, 1000); 
     } 

     function StopRun(){ 
     window.clearTimeout(runCarousel); 
     } 

     function StopTimer(){ 
     window.clearTimeout(runTimer); 
     } 

     function firstStart(){ 
      setTimeout("Carousel()", 10000); 
     } 

     firstStart(); 
    </script> 
</body> 
</html>

fonte

2012-10-01 user1697962

Si prega di prendere in considerazione la pubblicazione di un [JS Fiddle demo] (http://jsfiddle.net/), o simili; in questo modo possiamo vedere cosa sta succedendo. E non dobbiamo fare i nostri demo: aiutaci * a * per aiutarti * tu *. –

In primo luogo c'è un errore:

function firstStart(){ 
    setTimeout("Carousel()", 10000); 
}

correttamente:

function firstStart(){ 
    setTimeout(Carousel, 10000); 
}

, alla fine, tutte le impostazioni vengono ripristinate sui valori predefiniti e avviare il timer:

in Carousel:

if(firstval == 1200){ 
     document.getElementById('abc-container').style.left = "0" + "px"; 
     firstval = 0; 
     StopRun(); 
     StartTimer() 
     return; 
    }

in StartTimer

if(secondval == 30) { 
     secondval = 0; 
     StopTimer(); 
     Carousel(); 
     return; 
    }

DEMO

Here is my example

fonte

2012-10-01 09:43:50

Grazie per la risposta :). ma il ciclo non sembra liscio come vorrei. La prima parte (rosso) è appena tornata senza animazione. – user1697962

@ user1697962 guarda questo http://jsfiddle.net/M8GhH/2/ –

Ciao, ottima idea di farlo in loop in quel modo, ma ho trovato il modo di farlo loop. Grazie per il tuo aiuto, lo consiglio :) – user1697962

fare una presentazione in loop JavaScript jQuery senza

risposta

Problemi correlati