最佳答案
你有多个滑块可以实现这个目的.
我个人总是使用flexslider,但nivoslider也是一个不错的选择.
原文链接:https://www.f2er.com/html/426748.html我个人总是使用flexslider,但nivoslider也是一个不错的选择.
http://flexslider.woothemes.com/thumbnail-slider.html
http://creative.glenfield.net/nivoexamples3.aspx
你的滑块主要是css.
我认为对于你的情况你会使用flexslider.
你需要创建2个滑块.
1作为另一个的导航.
以下是flexslider所有选项的链接:
https://github.com/woothemes/FlexSlider/wiki/FlexSlider-Properties
对于主滑块,您可以使用下方选项设置3项可见.
minItems 0 Number Minimum number of carousel items that should be visible.
maxItems 0 Number Maximum number of carousel items that should be visible.
move 0 Number Number of carousel items that should move on animation.
使用下面的代码将1个滑块用作另一个滑块.
$(window).load(function() {
// The slider being synced must be initialized first
$('#carousel').flexslider({
animation: "slide",controlNav: false,animationLoop: false,slideshow: false,asNavFor: '#slider'
});
$('#slider').flexslider({
animation: "slide",sync: "#carousel"
});
});
希望我能把你推向正确的方向.