2012-01-09 6 views
1

이 가능하지만이 버튼에, 슬라이드를 관련 슬라이드를 클릭합니다.시뮬레이션 다음 버튼을 클릭

을 때 내가하고 싶은 것은 그래서 타이머를 추가하는 것을 내 사이트에 슬라이드 쇼를 한 경우 확실하지 않음 3 초 후에 다음 버튼을 클릭하면 슬라이드 쇼가 자동으로 슬라이드됩니다.

필자는 바이올린을 추가

$('#button a').click(function(){ 
    var integer = $(this).attr('rel'); 
    $('#myslide .cover').animate({left:-720*(parseInt(integer)-1)}) /*----- Width of div mystuff (here 160) ------ */ 
    $('#button a').each(function(){ 
    $(this).removeClass('active'); 
     if($(this).hasClass('button'+integer)){ 
      $(this).addClass('active')} 
    }); 


}); 

... http://jsfiddle.net/5jVtK/

답변

3

가장 간단한 방법은 setTimeout (지연 후 한 번 발생) 또는 setInterval (모든 빈도 발생)을 사용하는 것입니다.

setTimeout(function() { $('#button a').trigger('click') }, 3000);

setInterval(function() { $('#button a').trigger('click') }, 3000);

당신이 구현 취득 후에는 사용자의 마우스 (다음 버튼 위에 또는 슬라이드 쇼 위에있을 때 자동 진행을 중지와 같은 다른 미묘한에 대해 생각 할 수 있습니다 그 이유는 현재 표시된 내용에 대한 관심을 의미하기 때문입니다.) 그리고 mouseout에서 autoadvance를 다시 시작하십시오.

다음 : 여러 슬라이드를 계속 진행하기 위해 트리거 버튼을 동적으로 찾는 방법을 알아야합니다. 여기에 행동이 보여주는 바이올린에 대한 링크입니다

`

function click() { 
    // Find the button for the next slide in relationship to the currently active button 
    var $next = $('#button').find('.active').next('a'); 

    // If there isn't one, go to the beginning 
    if (! $next.length) { 
     $next = $('#button').find('a').first(); 
    } 

    // Trigger the click 
    $next.trigger('click'); 

    setTimeout(click, 3000); 
} 

setTimeout(click, 3000); 

:이 그것을 할 수있는 한 가지 방법이 같은

http://jsfiddle.net/5jVtK/1/

+0

Ahh thankyou, 나는 아직도 제대로 작동하지 않습니다./jsfiddle을 추가했습니다 ... – Liam

+0

Liam - 추가 문제가되기 위해 취해야 할 조치를 돕기 위해 제 설명에 추가했습니다 ... 다음 버튼을 찾습니다. 당신은 동적으로 필요합니다. 희망이 도움이됩니다. – Nate

+0

훌륭해, 고마워 네이트! – Liam

3
당신은이 3에서 일어날 수 있도록

$('#button a').click(); 

을 수행하여 jQuery로 요소의 click 이벤트를 트리거 할 수 있습니다

제 2 간격, 사용 setInterval() :

function simulateClick(){ 
    $('#button a').click(); 
}; 

setInterval(simulateClick, 3000); 
+0

현재 진행중인 작업은 다음 버튼을 시뮬레이션 할 때처럼 자동화 할 수 있습니까? – Liam

+0

@ Liam : 나는 내 대답을 확장했다. 상기 참조하십시오. –

+0

고마워요 @ 콜린, 저는 현재 5 개의 버튼을 가지고 있으며, 함수가 실행될 때 모든 버튼을 클릭 한 것처럼 시뮬레이트합니다. 모든 버튼을 실행하지 않고 .next()를 구현할 수있는 방법이 있습니까? – Liam

0

뭔가 작동합니다. 이 방법으로 우리는 한 간격으로 함수를 실행하고 클릭은 동일한 함수를 트리거합니다. 타이머는 버튼을 활성화 할 필요가 없으며 버튼이 활성화되는 기능을 활성화하기 만하면됩니다.

$(document).ready(function() { 
    var timer = setInterval(slideFunction, 5000); 

    $('#button a').click(function(){ 
    slideFunction(); 
    }); 
    function slideFunction(){ 
     var integer = $('#button a').attr('rel'); 
     $('#myslide .cover').animate({left:-720*(parseInt(integer)-1)}) /*----- Width of div mystuff (here 160) ------ */ 
     $('#button a').each(function(){ 
      $(this).removeClass('active'); 
      if($(this).hasClass('button'+integer)){ 
      $(this).addClass('active')} 
     }); 
    } 
}); 
관련 문제