SORU
8 Mayıs 2011, Pazar


Nasıl setınterval ayrıca bir sekme Chrome devre dışı olduğunda iş yapabilir miyim?

setInterval bir kod parçası 30 kez ikinci çalıştırıyorum. Bu harika çalışıyor, başka bir sekme seçtiğinizde, ancak benim kod sekmesini etkin hale gelmesi), setInterval nedense bir bekleme durumuna ayarlanır.

Bu basitleştirilmiş test çalışması (http://jsfiddle.net/7f6DX/3/) yaptım:

var $div = $('div');
var a = 0;

setInterval(function() {
    a  ;
    $div.css("left", a)
}, 1000 / 30);

Bu kodu çalıştırın ve başka bir sayfaya geçiş yapmak için, birkaç saniye bekleyin ve sonra geri dön, animasyon diğer sekmesini geçti, bu noktada devam ediyor. Animasyon sekmesi pasif durumda 30 kez ikinci çalışmıyor. Bu kez miktarı setInterval işlevi her ikinci olarak, eğer sekmesini devre dışı ise 30 ama sadece 1 veya 2 olmaz denir sayım ile teyit edilebilir.

Bu performansını artırmak için tasarım yaptı sanırım, ama bu davranışı devre dışı bırakmak için herhangi bir yolu var mı? Aslında benim senaryoda bir dezavantaj.

CEVAP
8 Mayıs 2011, Pazar


Sadece animasyon işlevi kene tarafından olungerçek geçen süre.

http://jsfiddle.net/7f6DX/31/

var div = $('#my-div');
var leftValue = 0;
var interval = (1000/20); //20fps
var before = new Date();

setInterval(function()
{
    now = new Date();
    var elapsedTime = (now.getTime() - before.getTime());

    if(elapsedTime > interval)
    {
        //Recover the motion lost while inactive.
        leftValue  = Math.floor(elapsedTime/interval);
    }
    else
    {
        leftValue  ;
    }

    div.css("left", leftValue);
    before = now;    

}, interval);

EDİT

@Yorum UpTheCreek:

Sunum sorunları için iyi, ama hala çalışmaya devam etmesi için gereken bazı şeyler vardır.

Bunun için HTML5 Web Workers kullanabilirsiniz. Möhre's answer... bir göz atın

NOT

Animasyonlar göz önüne alındığında, bu sorun ve many others jQuery animasyon işlevlerini yerine CSS geçişler kullanarak çözülür. Bunu al hadi animate() yöntemleri gibi CSS geçişler yarar jQuery plugin tavsiye ederim.

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • André Frizzo

    André Frizz

    16 Aralık 2006
  • GALERNAYA20

    GALERNAYA20

    19 NİSAN 2011
  • OVERWERK

    OVERWERK

    6 Temmuz 2010