jQuery Cycle2多個幻燈片導航

Question

我需要工作的第一個滑塊導航和第二個自動，但點擊導航按鈕上運行兩個滑塊。代碼在這裏：

<script type="text/javascript"> 
jQuery(function(){ 
    jQuery('.scrollsingle').cycle('prev'); 
    jQuery('.scrollsingle ').cycle('next'); 
}); 
</script> 

<button data-cycle-cmd="prev">Prev</button> 
<button data-cycle-cmd="next">Next</button> 

<div class="images scrollsingle cycle-slideshow" 
    data-cycle-fx="scrollHorz" 
    data-cycle-timeout="4000" 
    data-cycle-slides="> div"> 

    <div>content</div> 
    <div>content</div> 
    <div>content</div> 
    <div>content</div> 
</div> 

<article class="span3 box boxstaff cycle-slideshow" 
    data-cycle-fx="scrollHorz" 
    data-cycle-timeout="2000" 
    data-cycle-slides="> div" 
    > 

    <div>content</div> 
    <div>content</div> 
    <div>content</div> 
    <div>content</div> 
</article> 

Answer 1

在聲明名稱爲「循環播放幻燈片」一類，你自動初始化幻燈片，這將治療與該類所有的容器以同樣的方式，像任何其他會的類。你需要做的是手動通過聲明不同的類像這樣初始化你的幻燈片：

//Initialize slide1 
$('.slide1').cycle(); 

//Initialize slide2 
$('.slide2').cycle(); 

：

<div class="slide1"> 
    <img src="image1.jpg"> 
    <img src="image2.jpg"> 
    <img src="image3.jpg"> 
    <img src="image4.jpg"> 
</div> 

<div class="slide2"> 
    <img src="image5.jpg"> 
    <img src="image6.jpg"> 
    <img src="image7.jpg"> 
    <img src="image8.jpg"> 
</div> 

然後你自定義類下操縱何事slidesow之前jQuery代碼必須有這些簡單的線條

之後，您可以像循環幻燈片一樣做所有事情...... 希望能爲您提供幫助！

例：

$('.slide1').cycle('goto', 4);