2012-03-21 9 views
0

jQuery 스크립트가 몇 개 div로 이동했습니다. 코드는 다음과 같습니다. 해결해야 할 두 가지 문제가 있습니다..click (jQuery) 일 때 setTimeout 일시 중지

  1. 사용자가 탭을 클릭 할 때 타이머를 재설정하거나 추가하는 중입니다. 현재주기에 따라 슬라이드가 다음 슬라이드로 즉시 전환 될 수 있습니다.

  2. 사용자가 특정 슬라이드 위로 마우스를 가져 가면 타이머를 일시 중지 (즉, 시간 초과를 지우고 다시 시작)합니다.

다음을 달성하기 위해, 나는에서는 setTimeout에게 변수 ($ theTimeout)를주고 사항 clearTimeout에 시도 후 다시 show_cycle_elem()를 실행합니다. 얼마나 많은 다른 방법을 시도해도 (클릭과 같은 다른 이벤트를 함수에 던짐으로써 setTimeout 다음에 즉시 호출하는 등) 완전히 올바르게 작동하지는 않았다.

아이디어가 있으십니까?

$(document).ready(function(){ 
var theId = 0; 
function navClass(it){ 
    $('#hero nav a').removeClass('over'); 
    $(it).addClass('over'); 
} 
$.fn.cycle = function(timeout){ 
    var $all_elem = $(this); 
    show_cycle_elem = function(){ 
     if(theId == $all_elem.length) theId = 0; 
     $all_elem.hide().eq(theId).fadeIn(); 
     navClass('#a' + theId); 
     var $theTimeout = setTimeout(function(){show_cycle_elem(++theId)}, timeout); 
    } 
    show_cycle_elem(); 
} 
$('div.hero_slide').cycle(10000); 
$('#hero nav a').click(function(party){ 
    party.preventDefault(); 
    theId = this.id.substr(1); 
    navClass($(this)); 
    $('.hero_slide').hide(); 
    $('#hero' + theId).fadeIn(); 
}); 
}); 

감사합니다.

+0

아마도 오늘은 좋지 않지만 클리어 타임 아웃은 어디에 있습니까? –

+0

나는 타임 아웃을 지우려고 시도했던 것들을 포함하지 않았다. 내 질문은, 사실, 어디서 어떻게'clearTimeout ($ theTimeout) '을 사용해야합니까? – alexjewell

+1

어디서나 $ theTimeout을 사용하려면 전역으로 선언해야합니다. –

답변

1

몇 가지 옵션이있는 유체 슬라이더를 만들려고하는 것 같습니다. 몇 달 전에 생각 했었지만 실제로는 그렇게 쉽게 보이지 않습니다. 우리는 jQuery를 사용하기 때문에 우리는 플러그인 형식으로 작성할 수 있습니다. 우리는 변수를 선언하고 시간이 지남에 따라 변하는 변수를 사용할 수 있어야하기 때문에 ...

쫓아 다닌다. 슬라이드/일시 정지로 작업하고 싶다면 타임 아웃 ID를 제어하고 저장할 필요가 있으며 다음 슬라이드 애니메이션을 방지하기 위해 필요한 시간 제한을 지우십시오.

일부 아주 기본적인 기능을 가진 버전을 작업하지만 당신은 적어도 시작/중지 및 다음/이전/랜드 수행 할 수 있습니다 그래서 당신은 당신이 설명하는 일을 플러그인/기능을 만들고 싶어

http://jsfiddle.net/sg3s/RFJMy/218/

을 논리적 인면에서 인터럽트를 실제로 처리 할 수있는 기반을 갖기 위해서는 코드의 좋은 부분을 다시 작성해야합니다.

관련 문제