2017-10-19 7 views
1

사람들,jQuery (document) .ready() + 포커스 대기

누군가가 모든 탭을 새로 고칩니다. 내 탭이 전경이 아닌 탭에 있습니다. jQuery(document).ready().

: 그래서

이 실행

  • 어떻게 탭이 활성화 될 경우에만 내 애니메이션을 실행하는 데 어떻게해야합니까?

  • 나는 탭 어쨌든 전경 및 활성화되어있는 경우 실행 어떻게받을 수 있나요?

나는 시도했다 :

<script>jQuery(document).ready(function() { jQuery(window).focus(function() { setTimeout(function(){ jQuery('.juiz-outdated-message').addClass('active'); }, 500); }); });</script> 

이 너무 많은 사이트 그래도 난 그것을 수행하는 방법에 대한 리소스를 찾을 수에 발생!

+0

gurvinder372 @, 감사하지만 당신은 내 질문 I의 코드 조각에서 볼 수 있듯이 이미 시도했지만 작동하지 않습니다. – Harry

답변

0

어쨌든 탭이 포어 그라운드이고 활성화되어 있으면 어떻게 실행합니까? page visibility api를 사용

, 당신은 visibilitychange이벤트를 처리해야합니다.

탭이 활성화 된 경우에만 애니메이션을 실행하려면 어떻게합니까?

다음은 공유 문서 링크의 예제 코드입니다.

function handleVisibilityChange() { 
    if (document.hidden) { 
    pauseSimulation(); 
    } else { 
    startSimulation(); 
    } 
} 

document.addEventListener("visibilitychange", handleVisibilityChange, false); 

공유 문서 링크는 다른 브라우저뿐만 아니라 주어진 다른 대체 있고, 같은 자세히 here을 논의하고있다. 어떤 논리를 사용하여 내 자신의 질문에 대답

+0

고맙습니다. 따라서 '첫 번째 포커스'또는 이와 유사한 이벤트는 없습니다. 첫 번째 인스턴스에 포커스가 있는지 확인해야합니다. 고맙습니다! – Harry

0

@ 친절하게 제공 gurvinder372 : 귀하의 코멘트에 대한

function animateeeee() { //the magic function 
 
\t setTimeout(function(){ jQuery('.juiz-outdated-message').addClass('active'); }, 500); 
 
}; 
 
jQuery(document).ready(function() { //runs on DOM ready 
 
    if (document.hasFocus()) { //if we already have focus... 
 
\t  animateeeee(); //do it now 
 
    } else { //otherwise 
 
\t \t jQuery(window).focus(function() { //bind to focus 
 
\t \t \t animateeeee();// then run 
 
\t \t }); \t \t  
 
    }; 
 
});