All geek questions in one place

Bootstrap affix-bottom not working

I am working with bootstrap 3 (current version).

I am trying to create navigation using affix-plugin. I expect that as long as I HAVE ABOVE a specific navigation link, then the affix-top link class, and when I scroll down BELOW this specific link, the class should change to "affix-bottom".

But: "affix- bottom " - the class is not displayed.

Here are the facts:

-> I have a very long navigation bar.

-> Each side hyperlink refers to a different section on the page.

-> I added data-spy = "affix" data-offset-top = "60" data-offset-bottom = "200" to all the <li> -Elements elements.

Now, when I scroll down and look through all the navigation links using Chrome or firefox, I see that when scrolling down to a specific link, the affix .js plugin changes the class attribute from class = "affix-top" to class = "affix "(which is exactly what I expect).

BUT:

When I scroll down to NEXT, the class attributes do not change to class = "affix- bottom ".

-

What am I doing wrong?

Or is this a bug in Bootstrap?

+4
source share
1 answer

You need to add: data-spy="affix" data-offset-top="60" data-offset-bottom="200" only for your parent's DOM element, for example ulor ol.

data-offset-bottom - , , , 200 , nav .

, .

+1

Source: https://habr.com/ru/post/1542980/

More articles:


All Articles