CODEWITHSUNDEEP
jquerytwitter-bootstrap
ScubaBen
ScubaBen

Reputation: 138

Bootstrap Scrollyspy remove class

I am using Bootstrap Scrollspy and I want to remove a class on scrolling.

My approach is this:

function myFunction() {
    $(".scroll-area").scrollspy({target: "#header-wrapper"});
    $("#header-wrapper").on("activate.bs.scrollspy", function () {
        $("#header-wrapper").removeClassName("container");
    });
    }
}

What am I missing?
I put the whole thing in a fiddle here: https://jsfiddle.net/rndu2p4t/

Thanks for your help!

Upvotes: 1

Views: 138

Answers (1)

James Ives
James Ives

Reputation: 3365

Scroll Spy is used to update nav targets based on scroll position, you can see a working example of how to use 'activate.bs.scrollspy' below. Once it reaches the second section it will remove the 'my-bg' class.

http://jsfiddle.net/q4p5r/293/

With that being said you do have an error in your code which could be causing the issue. It's also difficult to tell if your function is being called properly without seeing all of your code.

$("#header-wrapper").removeClassName("container");

Should be

$("#header-wrapper").removeClass("container");

If you want to simply remove a class when the scrolling area is moved use jQuery's scroll instead. I created an example of that here: https://jsfiddle.net/rndu2p4t/16/

$(".scroll-area").scroll(function () {
    $("#header-wrapper").removeClass("container");
});

Hopefully that helps, good luck!

Upvotes: 1

Related Questions