수동으로 전진 궤도 슬라이더

Question

나는 Zurb 'Orbit'자바 스크립트 슬라이더 http://www.zurb.com/playground/orbit-jquery-image-slider을 사용하고 있으며, 슬라이더를 왼쪽이나 오른쪽으로 수동으로 전진시키기 위해 내 자신의 자바 스크립트를 실행하고 싶습니다.

기본적으로 나는 콘텐츠로 채우기를 원한다. 그 다음에 타이머 기능이나 클릭만으로 페이지 전체와의 사용자 상호 작용에 따라 '슬라이드'가 보이지 않도록하고 싶다. 라이브러리가 이미 제공 한 탐색 이미지. 그 실패

I라는 링크가 그렇다면 '내 링크',이 같은 무언가를

...

$('#myLink').click(function() { 
    ... code to advance javascript slider... 
    $('#content').orbit(?????); 
}); 

, 내 '콘텐츠'는 HTML 양식 및 기타 유사한 재료가 될 것입니다, 아는 사람 이미 원하는대로하는 좋은 무료 라이브러리?

Answer 1

가장 쉬운 방법은

$(".slider-nav .right").click(); 

화살표를 클릭하고 시뮬레이션하는 것입니다. 글 머리 기호 탐색 옵션을 사용하기 위해 필요한 경우 변경하십시오.

플러그인이 어떤 종류의 API도 노출시키지 않기 때문에 그보다 더 우아 할 것 같지 않습니다. 모든 플러그인이 개인적으로 플러그인에서 폐쇄됩니다.

Answer 2

"을 afterLoadComplete"를 사용하여 궤도 개체에 대한 참조를 받기 :

myOrbit.shift(1); 

또는

myOrbit.shift('prev'); 

또는 :

는

var myOrbit; 

$(".orbitSlides").orbit({ 
     afterLoadComplete: function() { 
      myOrbit = this; 
     } 
}); 

이어서 슬라이드를 변경하기 위해 '이동'기능을 사용하여

,210

Answer 3

나는 사업부의 #rotator 가정이

$('#next').click(function(){ 
$('#rotator').trigger("orbit.next"); 
}) 
$('#prev').click(function(){ 
    $('#rotator').trigger("orbit.prev"); 
}) 

이 궤도 슬라이더입니다 사용합니다.

Answer 4

나는 이러한 다른 답변을 얻을 수 없습니다. 나는 조금 해키 알고 있지만 나는이 쉬운 발견

HTML :

<p id='back'>Back</p> 
<p id='next'>Next</p> 

CSS : (당신이 사용하는 경우 내장 navigation_arrows: false;, 탐색 화살표를 제거하고 더 이상 visibility: hidden; 때문에, 조작 할 수 없습니다 구조에)

.orbit-prev, .orbit-next { 
    visibility: hidden; 
} 

jQuery를!

$('#back').on('click', function() { 
    $('.orbit-next').click(); 
}); 

$('#next').on('click', function() { 
    $('.orbit-prev').click(); 
});