Firefox 및 Chrome에서 탭을 전환할 때 setInterval의 이상한 효과에 대한 탐색 및 솔루션입니다! _자바스크립트 기술

이전 글에서 : Zhubajie.com 왼쪽 하단에 있는 텍스트 스크롤이 잘 되는 것 같아서 직접 찾아보고 제 나름대로 구현해봤습니다!

이런 효과는 있지만 효과는 거의 없습니다. 데모의 영향력은 엄청납니다!

인터넷상의 일부 사람들도 이런 문제를 겪었습니다. 아래 게시물 주소를 참조하세요.

firefox 6의 setInterval 문제

많은 분들이 논의해 주셨으나 답변이 없으시네요.

아무리 생각해봐도 알 수가 없어요!

오늘 갑자기 뭔가가 떠올랐어요. 스레드의 개념일지도 모르지만, 아직 구체적인 이유를 아시는 분이 계시다면 알려주시면 감사하겠습니다.

데모의 검은색 Div는 브라우저 탭 전환에 영향을 받지 않습니다

빨간색 Div가 영향을 받습니다.
HTML:

코드 복사 코드는 다음과 같습니다.

브라우저 탭 전환에 영향을 받지 않습니다! 후오오

브라우저 탭 전환의 영향을 받았습니다! 5555

javascript:

코드 복사 코드는 다음과 같습니다.

(function(){
var elem = Meng.getId('move'),
elem2 = Meng.getId('move2'),
pos = Meng.getElemViewPosition( elem),
view = Meng.getBrowserView(),
//회색 블록 이동 함수
move = function(){
var t1 = Meng.animate(elem,{top:0,left :0} ,{top:view.height-100,left:view.width-100},3000,function(){
var t2 = Meng.animate(elem,{left:view.width-100}, {왼쪽: 100-view.width},3000,function(){
var t3 = Meng.animate(elem,{top:view.height-100},{top:100-view.height},3000, function() {
move();//t3의 이동이 완료된 것을 확인한 후 move() 함수를 다시 호출합니다
})
}); };
move();
//빨간 블록 이동 기능
Meng.setStyle(elem2,{top:0,left:(view.width-100) 'px'}); var move2 = function( ){
var t1 = Meng.animate(elem2,{top:0,left:view.width-100},{top:view.height-100,left:100-view.width} ,3000,함수( ){
var t2 = Meng.animate(elem2,{top:view.height-100},{top:100-view.height},3000,function(){
var t3 = Meng.animate( elem2,{left:0},{left:view.width-100},3000,function(){
})
}); };
move2();
setInterval(function(){move2();},9050)
//빨간색 블록 모션 함수