CODEWITHSUNDEEP
javascripttwitter-bootstraphtml-liststwitter-bootstrap-3scrollspy
Roger Johansson
Roger Johansson

Reputation: 23214

Twitter bootstrap scrollspy - disable on smooth scroll?

We are using the twitter bootstrap scrollspy on a sidebar ul/il list, this works great. We do however also use smooth scrolling when clicking the links in the sidebar. This causes the scrollspy to highlight each and every element that comes into view, as it should in normal cases.

But when the scrolling is triggered by a click on the links in the side nav, the users most likely don't expect the menu to animate as the scrolling occurs. Is there any way to temporarily disable the scrollspy while the animated scroll is running, and then reenable it once scrolling is complete?

Upvotes: 8

Views: 5688

Answers (2)

dkimbell13
dkimbell13

Reputation: 123

add the following to the top of your local javascript...

$.fn.scrollspy.Constructor.prototype.destroy = function(){
    this.$element.off('scroll.bs.scroll-spy.data-api');
    this.$body.removeData('bs.scrollspy');
    return this.$body;
}

Upvotes: 0

JofryHS
JofryHS

Reputation: 5874

By setting a class as the target of scrollspy you can dynamically stop/resume scrollspy operation.

$('body').scrollspy({ target: '.spy-active' });

Now one will just need to add or remove the .spy-active class on the navigation.

Upvotes: 8

Related Questions