Search code examples
javascriptjqueryscrollsettimeout

Jquery disable toggle div if timeout


In my page after 5 seconds, a div collapse with setTimeout function, and also if the user scroll, the div collapse. I use slideUp and slideDown. If the timeout is started, the div is closed, but if the user scrolls the div opens and then closes again. I want to disable the opening of the first div with scroll if the div is closed automatically by setTimeout function

<div class="divCollapse">Text here</div>

$( document ).ready(function() {        
        var timer;
        if(!$(window).scrollTop()) {    
         timer = setTimeout(function(){ $('.divCollapse').slideUp();}, 5000);
        } 
        $(window).scroll(function() {               
                if ($(this).scrollTop()>10){                    
                   $('.divCollapse').slideUp();
                    clearTimeout(timer);
                }
                else{                     
                   $('.divCollapse').slideDown();                        
                }           
        });          
    }); 

Thank you in advance!


Solution

  • var timer;
    if ($(window).scrollTop() <= 10) {
        timer = setTimeout(function () {
            $('.divCollapse').slideUp();
        }, 5000);
    }
    $(window).bind('scroll.collapse', function () {
        if ($(this).scrollTop() > 10) {
            $('.divCollapse').slideUp();
            clearTimeout(timer);
            timer = false;
        } else if (!timer) {
            $('.divCollapse').slideDown();
        }
    });