Question

我想使用smoothdivscroll（http://smoothdivscroll.com/index.html）来滚动图像块，用户可以使用http://sachinchoolur.github.io/lightGallery/index.html灯箱打开这些图像。不幸的是，这些脚本在使用相同的选择器时不起作用。

<script type="text/javascript">

 if (Modernizr.touch) {   
    $(".scroll-banner").smoothDivScroll({ 
        hotSpotScrolling: false,
        touchScrolling: true,
        manualContinuousScrolling: true,
        mousewheelScrolling: false
    });
} else {   
$(".scroll-banner").smoothDivScroll({ 
        mousewheelScrolling: "horizontal",
        mousewheelScrollingStep: -1,
        easingAfterMouseWheelScrollingFunction: "easeOutCirc",
        manualContinuousScrolling: true,
        autoScrollingMode: "onStart",
        scrollingHotSpotLeftClass: "prev",
        scrollingHotSpotLeftVisibleClass: "prevVisible",
        scrollingHotSpotRightClass: "next",
        scrollingHotSpotRightVisibleClass: "nextVisible",
});
}
$(function() {
$(".scroll-banner").lightGallery({
      loop:true,
      auto:false,
      pause:1000,
      counter:true,
      vimeoColor: "000000"
    });
});
</script>

如何让两个插件使用相同的选择器？

Answer 1

是否可以这样使用它：

$(document).ready(function() {
    var scrollbanner = $(".scroll-banner");
    scrollbanner.smoothDivScroll({ 
        mousewheelScrolling: "horizontal",
        mousewheelScrollingStep: -1,
        easingAfterMouseWheelScrollingFunction: "easeOutCirc",
        manualContinuousScrolling: true,
        autoScrollingMode: "onStart",
        scrollingHotSpotLeftClass: "prev",
        scrollingHotSpotLeftVisibleClass: "prevVisible",
        scrollingHotSpotRightClass: "next",
        scrollingHotSpotRightVisibleClass: "nextVisible",
    });

    scrollbanner.lightGallery({
        loop:true,
        auto:false,
        pause:1000,
        counter:true,
        vimeoColor: "000000"
    });
});

在您的代码中，当DOM准备好而另一个不是时，会调用其中一个函数。更改执行顺序以将功能添加到div时，行为/错误是否会发生变化？

使用相同的相同选择器查询lightGallery + smoothdivscroll，

1 个答案: