2015-02-02 4 views
0

setInterval을 사용하여 목록에 '플래시'효과를주는 함수를 실행합니다.setInterval 'stacking'up

페이지를 열린 상태로 유지하면서 다른 탭을 방문하면 10 분 정도 후에 다시 돌아 오지만 setInterval은 함수가 계속 호출되기 때문에 매 1 초마다 작동하는 것처럼 느낍니다.

어쨌든이 문제를 해결하기 위해 시간이 지남에 따라 쌓이는 느낌이 들릅니까?

function flashListItems(){ 
    $('.imageview_navigation li').each(function(i) { 
    $(this).delay((i++) * 100).fadeTo(200, 0.8).fadeTo(200, 1); 
    }); 
} 

setInterval(function(){ 
    flashListItems(); 
}, 10000); 

바이올린 : http://jsfiddle.net/6w6wrsm0/이 코드 아무 문제가 없습니다

+0

당신이 반 좋은 WUD 바이올린 코드를 작업을 제공하는 경우! –

+0

바이올린 참고로 추가됨 :) – Lovelock

답변

1

은, 일부 웹 브라우저의 경우 너무 많은 사용을 발생하지 아래로 간격 이러한 유형의 둔화. 따라서 웹 페이지가 사용되지 않으면 가장 빠른 간격은 일반적으로 약 1 초입니다.

How can I make setInterval also work when a tab is inactive in Chrome? 그냥 실제 경과 시간에 의해 애니메이션 기능 틱합니다

여기에 언급되어이 문제를 해결하는 방법이있을 수 있습니다.

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 = new Date();  

}, interval);