在Flexslider中使用同一張幻燈片用於兩個不同的轉盤

Question

嗨， 我在flexslider中有一個幻燈片。

       <div id="slider" class="flexslider"> 
           <ul class="slides"> 
            <li> 
             <img class="center-block polaroidSlides" src="image.jpg" alt="descubre1" /> 
            </li> 
            <li> 
             <img class="center-block polaroidSlides" src="image.jpg" /> 
            </li> 
            <li> 
             <img class="center-block polaroidSlides" src="image.jpg" alt="descubre3" /> 
            </li> 
            <li> 
             <img class="center-block polaroidSlides" src="image.jpg" alt="descubre4" /> 
            </li> 
            <li> 
             <img class="center-block polaroidSlides" src="image.jpg" alt="descubre5" /> 
            </li> 
            <li> 
             <img class="center-block polaroidSlides" src="image.jpg" alt="descubre6"/> 
            </li> 
           </ul> 
          </div> 

即同步用轉盤：

<div id="carousel" class="flexslider mb0"> 
           <ul class="slides" > 
            <li> 
             <img class="polaroidCarrousel" src="image.jpg" /> 
            </li> 
            <li> 
             <img class="polaroidCarrousel" src="image.jpg" /> 
            </li> 
            <li> 
             <img class="polaroidCarrousel" src="image.jpg" /> 
            </li> 
            <li> 
             <img class="polaroidCarrousel" src="image.jpg" /> 
            </li> 
            <li> 
             <img class="polaroidCarrousel" src="image.jpg" /> 
            </li> 
            <li> 
             <img class="polaroidCarrousel" src="image.jpg" /> 
            </li> 
           </ul> 
          </div> 

這裏是我的javascript：

$(window).load(function() { 
// The slider being synced must be initialized first 
$('#carousel').flexslider({ 
    animation: "slide", 
    controlNav: false, 
    animationLoop: true, 
    slideshow: false, 
    itemWidth: 150, 
    itemMargin: 5, 
    asNavFor: '#slider' 

}); 


$('#slider').flexslider({ 
    animation: "slide", 
    controlNav: false, 
    animationLoop: true, 
    slideshow: true, 
    sync: "#carousel", 
    slideshowSpeed: 1500 
}); 

}）;

我做了什麼，是在使用相同的滑動器，我WANNA放兩個CARROUSELS，例如，當我點擊第一個CARROUSEL的圖像時，它將顯示在滑動器中，但是，如果我點擊第二個CARROUSEL它一個形象也展現在同一拉。

我該怎麼做？

感謝=）

Answer 1

如果我理解正確你的問題，一個簡單的方法，我會建議是show一個轉盤和hide另一個：

$("whatever clicked button to show #carousel").click(function() { 
    $("#carousel").show(); 
    $("#slider").hide(); 
}); 


$("whatever clicked button to show #slider").click(function() { 
    $("#carousel").hide(); 
    $("#slider").show(); 
}); 

還有其他的方法來做到這一點使用較少的HTML標記，但上述方法適用於當前狀態下的代碼。