视差式滚动,用户只能滚动一张幻灯片

时间:2013-12-09 01:59:29

标签: javascript jquery scroll

我正在使用ScrollTo插件创建一个简单的paralax风格的页面更改。滚动时会发生以下情况

var location = window.location.hash;
    if(location == '') { var location = '#home' }   // Default location

    slides = ['#home', '#about', '#characters'];    // All the slides in an array

    // Calculating previous and next slides
    var currentEl = slides.indexOf(location);
    var prevEl = currentEl - 1;
    var nextEl = currentEl + 1;

    if(delta > 0)
    {   
        if(location != '#home')
        {
            gofor(slides[prevEl]);  // Scrolling up
        }
    }
    else
    {
        if(location != '#characters')
        {
            gofor(slides[nextEl]);  // Scrolling down
        }
    }

});

这是gofor函数本身。

function gofor(slide)
{
    $(slide).clearQueue().ScrollTo({duration: 700});    // Scrolling to the given slide
    $('.nav>a').removeClass('active');          // Removing all active classes
$(slide + '_nav').addClass('active');       // Updating the menu class with the _nav suffix id
window.location.hash = slide;               // Updating the location.hash with the new position

}

这样做还可以,但是当您滚动滚轮多于一步时,它会向前移动多页。如何停止滚动功能一段时间(如3秒)然后再让鼠标重新获得滚动功能?

感谢。

0 个答案:

没有答案