重置scrollTo()数据

时间:2013-12-09 17:28:19

标签: javascript jquery scrollto

我有一些奇怪的问题。我正在使用scrollTo()插件来滚动页面。我有垂直滚动的上下箭头,水平滚动的左右箭头。问题是,当我点击右箭头时,它向右滚动,然后如果我点击向下箭头,它首先进入左侧部分,然后向下然后再向右移动。但它应该只向下滚动。正如您在我的代码中看到的那样,我重新启动call()函数,因此我相信scrollTo()会记住之前的位置,然后遵循之前的路径。

所以我的问题是,当我再次调用该函数时,如何重置scrollTo()数据。

HTML

<section class="main">
        <section class="section0">
            <img src="1-1.jpg">
        </section>

        <section class="section0">
            <img src="1-2.jpg">
        </section>

        <section class="section0">
            <img src="1-3.jpg">
        </section>
    </section>

    <section class="main">
        <section class="section1">
            <img src="2-1.jpg">
        </section>

        <section class="section1">
            <img src="2-2.jpg">
        </section>

        <section class="section1">
            <img src="2-3.jpg">
        </section>
    </section>

Jquery的

$(document).ready(function(){
    call(0);
});

function scrollToPosition(element) {
    if (element !== undefined) {
        $("html").scrollTo(element, 800, {
            margin: true
        });
    }
}
var counter = 0;
var call = function(counter) {

    var sections = $('.section'+counter);
    var position = 0;
    var next = $('#up');
    var prev = $('#down').hide();

    next.click(function(evt) {
        prev.show();
        scrollToPosition(sections[position += 1]);
        if (position === sections.length - 1) {
            next.hide();
        }
    });

    prev.click(function(evt) { 
        next.show();
        scrollToPosition(sections[position -= 1]);
        if (position === 0) {
            prev.hide();
        }
    });

}

$(function() {

    var sections = $('.main');
    var position = 0;
    var next = $('#right');
    var prev = $('#left').hide();

    next.click(function(evt) {
        counter++;
        call(counter);
        prev.show();
        scrollToPosition(sections[position += 1]);
        if (position === sections.length - 1) {
            next.hide();
        }
    });

    prev.click(function(evt) { 
        counter--;
        call(counter);
        next.show();
        scrollToPosition(sections[position -= 1]);
        if (position === 0) {
            prev.hide();
        }
    });

});

0 个答案:

没有答案