자전거 JQuery와 CSS의 배경 이미지

Question

난 그냥 내 마우스가 위에있을 때 비디오의 엄지 손가락을 변경하려면

...

나는이 스크립트를 작성했습니다 :

var thumb=0; 
var num_thumbs = 11; 
$("#<?=($video->id) ?>_video").hover(function(){ 
open_hover_div[<?=($video->id) ?>]=true; 
var timer = setTimeout(function(){ 

if (open_hover_div[<?=($video->id) ?>]==true) {$(".over_<?=($video->id) ?>").fadeOut(200);$(".overTxt_<?=($video->id) ?>").delay(201).fadeIn();}} 

, 1000); 

var thumbs = setTimeout(function(){if (open_hover_div[<?=($video->id) ?>]==true) { 
if (thumb > (num_thumbs-1)) {thumb=0;} 
$("#<?=($video->id) ?>_video").css('background-image','url(images/video/<?=$video->id?>/'+thumb+'.jpg)'); 
thumb++; 
}} 
, 1000); 

}); 

$("#<?=($video->id) ?>_video").mouseleave(function(){ 
thumb=0; 
open_hover_div[<?=($video->id) ?>]=false; $(".over_<?=($video->id) ?>").fadeIn();$(".overTxt_<?=($video->id) ?>").hide(); 
$("#<?=($video->id) ?>_video").css('background-image','url(images/video/<?=$video->id?>.png)'); 
}); 

문제가이 인을 부분 :

내가 이상 내 마우스를 넣어

var thumbs = setTimeout(function(){ 
if (open_hover_div[id) ?>]==true) { 
if (thumb > (num_thumbs-1)) {thumb=0;} 
$("#id) ?>_video").css('background-image','url(images/video/id?>/'+thumb+'.jpg)'); 
thumb++; 
}} 
, 1000); 

, 나는 ...이 아니라 순환 변화 한 변화를 확인하고 있습니다

스크립트는 다음을 수행해야합니다 :

• 이상, show 1.jpg, 2.jpg 등 모든 XXX 밀리 초;
• 나는 경우,하는 MouseLeave에
• (예 : 11.jpg이 0.jpg에 다시 시작) 0.jpg에 자동으로 다시 시작 마지막 이미지에 도달 다시 가져가 마우스

희망 내 문제에 대해 명확하게하기 위해 : (

는

Answer 1

당신은 setInterval 대신 setTimeout으로 사용하여야한다.

var thumbs = setInterval(function(){ // ...... 

을 그런 다음 mouseleave 경우에, 당신은 같은 간격을 취소하여야한다 같은 :

clearInterval(thumbs); 
thumbs = null;