2011-08-26 8 views
6
function countDownRound() { 
    if(myRoundTimeRemaining >= 0){ 
     var secs = myRoundTimeRemaining; 
     if(secs < 10) 
     { 
      secs = "0" + secs; 
     } 
     $("#countdown").html(':'+secs); 
     CountdownTimer = setTimeout(countDownRound, 1000); 
     myRoundTimeRemaining--; 
    } 
    else{ 
     $("#countdown").html(''); 
    } 
} 

Il codice di cui sopra fa quello che ci si aspetta, su Firefox. Ogni secondo un numero decrescente viene visualizzato nell'elemento "conto alla rovescia".Conteggio alla rovescia non rende proprio su Chrome/Safari, ma OK su Firefox

Su Safari e Chrome, il codice funziona correttamente, ma l'elemento sullo schermo non cambia. Se succede qualcos'altro (come ridimensionare la finestra del browser) gli elementi si aggiornano correttamente mentre.

Questo sembra un qualche tipo di ottimizzazione o problema basato su thread, ma non riesco a trovare una soluzione.

+4

funziona bene per me su chrome http://jsfiddle.net/br4uK/ –

+0

Funziona bene anche per me. Quale versione di Chrome e Safari stai utilizzando? –

+0

Interessante. Potrebbe avere qualcosa a che fare con lo stack di animazione di JQuery: ho trovato questo avviso: "A causa della natura di requestAnimationFrame(), non devi mai accodare le animazioni utilizzando un ciclo setInterval o setTimeout." Sebbene questo oggetto non stia animando, alcuni dei nostri altri oggetti sono ... –

risposta

0

Funziona bene anche per me su Chrome, Safari e Firefox.

Forse in questo caso che si don `t bisogno di utilizzare i tag HTML per visualizzare il risultato, di testo() può funzionare meglio di html().

Provare a utilizzare

$("#countdown").text(':'+secs); 

invece html().

OBS: Sembra che alcuni bambini di instabilità sul sistema operativo possano influenzare anche il rendering del browser. Qualcuno potrebbe confermare o negarlo?

Problemi correlati