防止FlexSlider缩略图在移动设备上滚动时更改主图像

Question

我试图让flexslider仅在移动设备上单击缩略图时才更改主图像。现在发生的是，如果滚动缩略图，主图像也会发生变化。您可以在此处查看示例。 https://dev.time2visit.com/hotel/destination_package_view/116

非常感谢您的帮助。

<div id="slider" class="flexslider">
                        <ul class="slides">
                            <li>
                                <img src="<?= base_url("/uploads/feature_image/{$hotel->feature_image}") ?>" alt="Image Alternative text" title="" class="hotel_property_feature_img">
                            </li>
                            <?php foreach ($hotel->images as $image) : ?>
                                <li>
                                    <img src="<?= base_url("/uploads/images/{$image}") ?>" alt="Image Alternative text" title="Outside Crowne Plaza">
                                </li>
                            <?php endforeach; ?>
                        </ul>
                    </div>
                    <div id="carousel" class="flexslider">
                        <ul class="slides">
                            <li>
                                <img src="<?= base_url("/uploads/feature_image/{$hotel->feature_image}") ?>" alt="Image Alternative text" title="" class="hotel_property_feature_img">
                            </li>
                            <?php foreach ($hotel->images as $image) : ?>
                                <li>
                                    <img src="<?= base_url("/uploads/images/{$image}") ?>" alt="Image Alternative text" title="Outside Crowne Plaza">
                                </li>
                            <?php endforeach; ?>
                        </ul>
                    </div>

下面是JS

<script>
$(window).load(function() {
    // The slider being synced must be initialized first
    $('#carousel').flexslider({
        animation: "slide",
        controlNav: false,
        animationLoop: false,
        slideshow: false,
        itemWidth: 210,
        itemMargin: 5,
        asNavFor: '#slider'
    });
    $('#slider').flexslider({
        animation: "slide",
        controlNav: false,
        animationLoop: false,
        slideshow: false,
        sync: "#carousel"
    });
});
</script>