두 개의 jcarousel을 사용하고 다른 하나는 영향을받습니다.

Question

sorgalla jcarousel 플러그인을 설정했습니다. 시도하려는 것은 회전식 슬라이드의 두 인스턴스가있는 경우입니다. 하나는 블록/세로 스타일이고 다른 하나는 가로 스타일입니다.

불행히도 나는 단지 Javascript와 Jquery를 배우기 시작 했으므로 여기에서 어떻게 진행해야할지 모르겠다. 최소한 내가 할 수있는 부분에 대해서는 도움이된다.

여기,

<ul id="mycarousel" class="jcarousel-skin-tango"> 
    <li>test</li> 
    <li>test1</li> 
    <li>test2</li> 

    </li> 
</ul> 

<ul id="second-carousel" class="jcarousel-skin-tango"> 
    <li>test</li> 
    <li>test1</li> 
    <li>test2</li> 

    </li> 
</ul> 

내가 두를 동기화 할 수있는 방법이 있나요 ... 내가 실제로 jcarousels를 삽입 할 경우 다음

<script type="text/javascript"> 
jQuery(document).ready(function() { 
jQuery('#mycarousel').jcarousel({ 
    start: 2, // Configuration goes here 
    wrap: "circular", 
    auto: 1, 
    scroll: 1, 

}); 
}); 

jQuery(document).ready(function() { 
jQuery('#second-carousel').jcarousel({ 
    start: 2, // Configuration goes here 
    wrap: "circular", 
    auto: 1, 
    scroll: 1, 

}); 
}); 
</script> 

은 ... 두 번 호출되는 함수 그래서 내가 위쪽 방향 헬리콥터를 누르면 두 번째 헬리콥터를 조종합니까? 다음은 아마도 임 확실하지에 대한가는 훨씬 쉬운 방법이있다, http://gonuts.ie/?page_id=99

은 궁극적으로 나의 목표는 자신의 페이지 상단에있는 http://www.skysports.com 무엇을 달성하는 것입니다 ... 그들이 테스트되고있는 사이트입니다. 다시 한번 감사드립니다.

Answer 1

두 개의 jCarousels를 Skysports 사이트와 연결하는 방법은 다음과 같습니다 (Skysports 예가 단일 캐 러셀이라는 Rick Calder의 설명에 주목).

var carousel_2; 
$('#mycarousel').jcarousel({ 
    start: 1, 
    wrap: "circular", 
    scroll: 1, 
    itemFirstInCallback: { 
     onBeforeAnimation: function(carousel, item, index, action) { 
      if (carousel_2) { 
       carousel_2[action](); 
      } 
     } 
    } 
}); 
$('#second-carousel').jcarousel({ 
    start: 2, 
    wrap: "circular", 
    scroll: 1, 
    vertical: true, 
    buttonNextHTML: null, 
    buttonPrevHTML: null, 
    initCallback: function(c) { 
     carousel_2 = c; 
    } 
}); 

DEMO

오페라에서 테스트 및 Sparky672의 의견을 참조하여

, 나는 wrap:"circular"으로 문제가되지 않았다.