如何實現bxslider Thumbnail pager下一頁上一頁button

我正在使用bxslider，我正在嘗試Thumbnail pager next prev按鈕來移動縮略圖，但我無法實現，你能幫我解決這個問題，這樣我就可以實現縮略圖帶有縮略圖的滑塊下一個prev按鈕。如何實現bxslider Thumbnail pager下一頁上一頁button

<ul class="bxslider"> 
    <li><img src="images/1.jpg" alt="1" width="960" height="600" /></li> 
    <li><img src="images/1aNicollet.jpg" alt="1" width="960" height="600" /></li> 
    <li><img src="images/7.jpg" alt="1" width="960" height="600" /></li> 
    <li><img src="images/100_2129.JPG" alt="1" /></li> 
    <li><img src="images/408619_10151175168202229_1189668486_n.jpg" alt="1" width="960" height="600" /></li> 
    <li><img src="images/134593849-jpg_215416.jpg" alt="1" width="960" height="600" /></li> 
    <li><img src="images/beauty-dress-girl-photo-wallpaper-1920x1200.jpg" alt="1" width="960" height="600" /></li> 
    <li><img src="images/meh.ro8908.jpg" alt="1" width="960" height="600" /></li> 
    <li><img src="images/lilian-garcia-2011-05-02.jpg" alt="1" width="960" height="600" /></li> 
</ul> 

<div id="bx-pager"> 
    <a href="#" id="slider-prev">Previous</a> 
    <a data-slide-index="0" href=""><img src="images/thumb/1.jpg" alt="1" /></a> 
    <a data-slide-index="1" href=""><img src="images/thumb/1aNicollet.jpg" alt="1" /></a> 
    <a data-slide-index="2" href=""><img src="images/thumb/7.jpg" alt="1" /></a> 
    <a data-slide-index="3" href=""><img src="images/thumb/100_2129.JPG" alt="1" /></a> 
    <a data-slide-index="4" href=""><img src="images/thumb/408619_10151175168202229_1189668486_n.jpg" alt="1" /></a> 
    <a data-slide-index="5" href=""><img src="images/thumb/134593849-jpg_215416.jpg" alt="1" /></a> 
    <a data-slide-index="5" href=""><img src="images/thumb/beauty-dress-girl-photo-wallpaper-1920x1200.jpg" alt="1" /></a> 
    <a href="#" id="slider-next">Next</a> 
</div>

來源

2014-01-10 user3181339

假設您正在尋找滑塊下方的第二個上一個/下一個動作。

打電話給你的滑塊如下：

var slider = $('.bxslider').bxSlider({ 
pagerCustom: '#bx-pager' 
}); 

$('a.pager-prev').click(function() { 
var current = slider.getCurrentSlide(); 
slider.goToPrevSlide(current) -1; 
}); 
$('a.pager-next').click(function() { 
var current = slider.getCurrentSlide(); 
slider.goToNextSlide(current) +1; 
});

的jsfiddle：http://jsfiddle.net/defonic/2cc7F/

來源

2014-01-26 02:39:36

如何實現bxslider Thumbnail pager下一頁上一頁button

回答

相關問題