CODEWITHSUNDEEP
javascriptjqueryscrollmousewheel
Vian Esterhuizen
Vian Esterhuizen

Reputation: 3904

Temporarily disable mousewheel until animation over

I'm working on a site that has a splash page and I want it to work so that when you scroll down the splash page, div.splash, will scroll up out of the way and the site scrolls in. I have it working for the most part, there is a just a small annoyance. Depending on how fast you scroll the mouse, it will scroll a certain distance into the main site.

I'd like it to work so that as soon as it detects even one click down on the mousewheel it will do all the stuff below but any additional movement in the mousewheel will be disabled until the slideUp()/animate() function is completed. That way when they scroll, the animations will happen but the person will still start at the very top of the page.

$(window).bind('mousewheel', function(e, delta) {
if(delta == -1){    
    disable_scroll();       
    $('.alpha.wrapper').show();
    $('.titles .beta').hide();
    $('.splash').slideUp(800);
    $('.titles').animate({
        top: '495px'
    },800,enable_scroll());
}
});

Upvotes: 0

Views: 1113

Answers (1)

Chase
Chase

Reputation: 29549

By moving the disable_scroll(); call to the document ready you'll be able to disable the user from scrolling as soon as the page loads.

Then, change the above to:

$(window).bind('mousewheel', function(e, delta) {
if(delta == -1){    
    $('.alpha.wrapper').show();
    $('.titles .beta').hide();
    $('.splash').slideUp(800);
    $('.titles').animate({
        top: '495px'
    },800,function(){enable_scroll();});

Upvotes: 1

Related Questions