flexslider 2活动thumbails

Question

我想创建一个滑块的缩略图，在滑块中一次显示2个图像。 我得到了一切工作，谢谢minItems:2

问题出现在缩略图导航。 单击第二个缩略图时，滑块将移动，并在滑块上显示第三个图像，尽管第二个图像已被显示。

有没有办法创建2个活动的缩略图，并使它们与滑块中显示的图像同步？

唯一的其他类似的滑块，我发现它使用这是他们的产品页面nastygal。 希望他们是一种方式，因为现在的方式并不真正用户友好。 谢谢！

我用这一个woocommerce店：

productSlider: { 
     selector: '#product-nav', 
     init: function() { 
      var base = this, 
        container = $(base.selector), 
        images = $('#product-images'), 
        zoom = images.data('zoom'); 

      container.flexslider({ 
       animation: "slide", 
       controlNav: false, 
       directionNav: false, 
       animationLoop: false, 
       slideshow: false, 
       itemWidth: 106, 
       itemMargin: 10, 
       asNavFor: '#product-images' 
      }); 

      images.flexslider({ 
       animation: "slide", 
       controlNav: false, 
       directionNav: true, 
       animationLoop: false, 
       slideshow: false, 
       minItems: 2, 
       maxItems: 2, 
       prevText: '<i class="fa fa-angle-left"></i>', 
       nextText: '<i class="fa fa-angle-right"></i>', 
       sync: "#product-nav", 
       start: function(slider) { 
        if (zoom) { 
         $(slider.slides[0]).easyZoom({ 
          preventClicks: false 
         }); 
        } 
       }, 
       before: function(slider) { 
        if (zoom) { 
         $(slider.slides[slider.animatingTo]).easyZoom({ 
          preventClicks: false 
         }); 
        } 
       } 
      }); 
     } 
    }, 

Answer 1

我不知道凸显了多个缩略图，但我知道，这个滑块始建于许多其他功能的处理多张图片：

http://www.owlcarousel.owlgraphic.com/index.html