CODEWITHSUNDEEP
javascriptjqueryeventstriggerstoggle
user1739222
user1739222

Reputation: 89

jQuery Toggle don't stop toggling by scrolling

hello i have a little Problem with Jquery toggeling.

when I scroll to the div toggling don't wanna stop and play in a while.

I don't no how I can trigger only one time the toggling on the div entrance and to set it back on the div exit ( from the top).

there is my code

$(document).ready(function(){

  $(".fa-home-mini").css("display", "none");

    $('.fa-home-mini').click(function () {

            if($('.navi').is(':visible')){

            $('.navi').toggle('slide', {
                direction: 'left'
            }, 1000);

        }
           else{          
                $('.navi').toggle('slide', {
                    direction: 'left'
                }, 1000);           
            }       
});

$(window).scroll( function() {
    var value = $(this).scrollTop();
    if ( value > 480 ){
        $(".fa-home-mini").css("display", "block");
        $('.fa-home-mini').trigger('click');

        }

    else
    {
        $(".fa-home-mini").css("display", "none");
        $(".navi").css("display", "block");


    }

});

});

Upvotes: 0

Views: 281

Answers (1)

Beroza Paul
Beroza Paul

Reputation: 2117

You can use off method inside the if block like below: 

if ( value > 480 ){
    $(".fa-home-mini").css("display", "block");
    $('.fa-home-mini').trigger('click');
    $(window).off('scroll')
}

Another approach will be:

var flag = false;
$(window).scroll( function() {
    var value = $(this).scrollTop();
    if ( value > 480 ){
        if(!flag) {
          $(".fa-home-mini").css("display", "block");
          $('.fa-home-mini').trigger('click');
          flag = true;
      }
    }
    else
    {
        $(".fa-home-mini").css("display", "none");
        $(".navi").css("display", "block");
    }
});

Upvotes: 1

Related Questions