How to disable JQuery waypoints on click menu item?

517 views Asked by At

I have read all the questions and answers on this topic. This should be a simple task, but I cannot get it to work.

JQuery version of Waypoints is working fine on top menu items, on one page site. I want to disable it upon clicking these menu items, and then restore it. I haven't gotten to the restore part yet. When I call the disable function I get a "TypeError: e.disable not a function". Commented lines show all the ways I have tried to include the disable() function:

var waypoints = $('section.waypoint').waypoint({
    handler:function(){
    var hash = '#'+this.element.id;     
    $('#menu-main-menu li.active').removeClass('active');
    $('#menu-main-menu li a[href='+ hash +']').parent('li').addClass('active');
    window.console.log($(window).scrollTop());
    if($(window).scrollTop() < 500){
    $('#menu-main-menu li.active').removeClass('active');
    }

    //$('#menu-main-menu li a').on('click', function(){
    //this.disableAll();
    //});
},
offset: '30%',
continuous: false
});

//waypoints.disable();

//Clicking the menu item link and animation

$('.jumbotron a, #menu-main-menu li a').on('click', function(e) {
e.preventDefault();
//$(waypoints).disable();
//$(waypoints).disableAll();
//waypoints.disable();
//waypoints.disableAll();
$('#menu-main-menu li.active').removeClass('active');

if (location.pathname.replace(/^\//,'') === this.pathname.replace(/^\//,'') && location.hostname === this.hostname) {
var $target = $(this.hash);
$target = $target.length && $target || $('[name="' + this.hash.slice(1) +'"]');
if ($target.length) {
var targetOffset = $target.offset().top - 45; 
$('html, body').animate({scrollTop: targetOffset}, 1000);
}
}    
});

I realize that waypoints is an array, so have tried disableAll() and iteration. No dice. Thanks in advance for your help!

1

There are 1 answers

1
Mary Hayne On
$('.jumbotron a, #menu-main-menu li a').on('click', function(e) {
e.preventDefault();
$('#menu-main-menu li.active').removeClass('active');

//Updated Code

$(waypoints).each(function(){
    this.disable(); 
}); 

if (location.pathname.replace(/^\//,'') === this.pathname.replace(/^\//,'') && location.hostname === this.hostname) {
  var $target = $(this.hash);
  $target = $target.length && $target || $('[name="' + this.hash.slice(1) +'"]');
  if ($target.length) {
        var targetOffset = $target.offset().top - 45; 
        $('html, body').animate({scrollTop: targetOffset},{
            complete: function(){

//Updated Code
                $(waypoints).each(function(){
                this.enable();  
                }); 
            }
        }, 1000);
  }
}    
});