javascript - jQuery Slider localScroll 和 Cycle 功能一起 - 不工作

Question

我目前正在“尝试”同时实现 localscroll 和循环功能以创建滑块。滑块应该有两个按钮（左和右），具有自动旋转循环。localscroll 和 click 功能的底部应该有小按钮，用户可以在其中导航到旋转滑块中的某个图像。

循环功能起作用。但是 localscroll 功能不起作用。请查看 JSFiddle

错误图片

jQuery：

    $(document).ready(function() {
        $("#slideshow").css("overflow", "hidden");
        $("#slideshow-nav").css("visibility", "visible");
    $("#slideshow-nav a[href=#lambo1]").addClass("active");

    $("#slideshow-nav").localScroll({
            target:'#slideshow', axis: 'x'
    });

$("#slideshow-nav a").click(function(){
            $("#slideshow-nav a").removeClass("active");
            $(this).addClass("active");
    });

    $("ul#slides").cycle({
            fx: 'fade',
            pause: 1,
            prev: '#prev',
            next: '#next'
    });

    $("#slideshow").hover(function() {
    $("ul#nav").fadeIn();
    },
            function() {
    $("ul#nav").fadeOut();
    });

});

Answer 1

您可能想尝试Nivo Slider。开箱即用，它具有您正在寻找的功能，以及许多选项，如果您需要自定义。

<script type="text/javascript">
jQuery(window).load(function(){
jQuery("#nivoslider-4").nivoSlider({
    effect:"random",
    slices:15,
    boxCols:8,
    boxRows:4,
    animSpeed:500,
    pauseTime:3000,
    startSlide:0,
    directionNav:true,
    controlNav:true,
    controlNavThumbs:false,
    pauseOnHover:true,
    manualAdvance:false
});
});
</script>