平滑滚动脚本和滑块不能​​一起工作

时间:2015-09-02 14:32:09

标签: javascript jquery ajax slider smooth-scrolling

我有一个带滑块和平滑滚动脚本的网站。问题是,我不能让他们同时工作。

这是网址: http://kop.hosts.ma-cloud.nl/template/

有人可以告诉我我做错了什么吗?我已经在使用var jq = $ .noConflict();

提前致谢!

1 个答案:

答案 0 :(得分:0)

你几乎有一切都在运作。请添加以下更正以使其完全正常运行。

第1步
在jQuery-ui库之前加载jQuery库(jquery.min.js),如下所示:

<!--Script voor smooth scroll-->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<!--Script voor de slider-->
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>

第2步
删除此行。

// var jq = $.noConflict();

第3步
在以下部分中删除 $ 的所有 jq 实例,例如我的版本:

$('.rightarrow, .leftarrow').hide();

$('#scrolldiv_container').mouseenter(function(){
    $('.rightarrow, .leftarrow').show();
    clearInterval(siId);
})
$('#scrolldiv_container').mouseleave(function(){
    $('.rightarrow, .leftarrow').hide();
        si();
});

$('.rightarrow').click(function () {
    var leftPos = $('#browser').scrollLeft();
    <!--1000 * 6 (aantal slides - 1)-->
    if (leftPos == 6000) {
        $('#browser').animate({
            scrollLeft: 0
        }, 400);
    } else {
        $('#browser').animate({
            scrollLeft: leftPos + 1000
        }, 150);
    }
});

$('.leftarrow').click(function () {
    var leftPos = $('#browser').scrollLeft();
    if (leftPos == 0) {
        $('#browser').animate({
            <!--1000 * 6 (aantal slides - 1)-->
            scrollLeft: 6000
        }, 400);
    } else {
        $('#browser').animate({
            scrollLeft: leftPos - 1000
        }, 150);
    }
}); 

第4步
现在重新加载页面,您将看到滑块和平滑滚动都正常工作。