带有图像缩略图的jQuery Slider

Question

我需要一个带有thumnail卷轴的jquery滑块,类似于附加的这个图像.任何人都可以发送链接到这样的jquery carausel.谢谢:)

Answer 1

尝试这个..我认为这个链接给你更多的想法..

http://www.jssor.com/demos/image-gallery.html

并在此链接中查看11. Likno JQuery Scroller

http://webtoolsdepot.com/30-best-jquery-image-and-content-slider-plugins/

Answer 2

您有多个滑块可以实现此目的。我个人总是使用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",
    controlNav: false,
    animationLoop: false,
    slideshow: false,
    sync: "#carousel"
  });
});

希望我已经把你推向正确的方向。