如何在jquery / flexslider中配置上/下導航？

Question

我有一個使用Woocommerce和WooTheme擴展名為Product Gallery Plugin的WordPress網站。 該插件使用基於jquery的flexslider。 根據下面的代碼，我在末尾添加了“ mousewheel：true”，從而啟用了使用鼠標滾輪瀏覽產品圖片的功能。 問題是，無論我向上或向下滾動，它只會使圖像向后循環。 因此，如果有3張圖像並且image1首先顯示，則無論我向上還是向下滾動，它都會跳到image3，然后跳到image2，然后跳回到image1。 我該如何配置它，以便在即時向上滾動（上一張圖片）和向下滾動（下一張圖片）時知道？

<script>
    jQuery(window).load(function() {
        jQuery('.product-gallery').flexslider({
            pauseOnHover: true,
            directionNav: false,
            <?php if ( get_option( 'woocommerce_product_gallery_slider_effect' ) == 'slide' ) {
                echo 'smoothHeight: true,';
            } ?>
            <?php if ( get_option( 'woocommerce_product_gallery_slider_navigation_style' ) == 'thumbnails' ) {
                echo 'controlNav: "thumbnails",';
            } ?>
            slideshow: <?php if ( get_option( 'woocommerce_product_gallery_slider_slideshow' ) == 'yes' ) { echo 'true'; } else { echo 'false'; } ?>,
            animation: "<?php echo get_option( 'woocommerce_product_gallery_slider_effect' ); ?>",
            direction: "<?php echo get_option( 'woocommerce_product_gallery_slider_direction' ); ?>",
            slideshowSpeed: "<?php echo floatval( get_option( 'woocommerce_product_gallery_slider_slideshowspeed' ) ) * 1000; ?>",
            animationSpeed: "<?php echo floatval( get_option( 'woocommerce_product_gallery_slider_animationspeed' ) ) * 1000; ?>",
            mousewheel: true
        });
    });
</script>

Answer 1

我想到了。 使用了在此處創建的jQuery mousewheel插件： https : //github.com/jquery/jquery-mousewheel

剛剛添加了jQuery min文件。