Disable scrollify plugin when reaches breakpoint

Question

This is the script I want to disable when the browser reaches the Bootstrap breakpoint of 768px width:

$(function() {
  $.scrollify({
    /*section: "section",*/
    interstitialSection: "interstitialSection", 
    offset: 30,
  });
});

Thanks in advance.

Answer 1

You can disable and enable scrollify plugin when you reach your breakpoint like this:

$(window).resize(function() {
  var width = $(this).width();
  if(width < 768) {
    $.scrollify.disable();
  } else {
    $.scrollify.enable();
  }
});

$(window).trigger('resize');

You can include debounce function, so disable and enable will fire only 50ms after resizing is done (check Codepen example).

CODEPEN