Stack Overflow
Stack Overflow

Questions tagged [scrollspy]

ScrollSpy may refer to the MooTools plugin or a similar jQuery plugin, such as the one popularly used in Bootstrap. The script listens to page scrolling and fires events based on the position to which the user has scrolled.

ScrollSpy may refer to the plugin or a similar plugin, such as the one. popularly used in The script listens to page scrolling and fires events based on the position to which the user has scrolled.

314 questions
26
votes
2 answers

What is the minimum code to make ScrollSpy bootstrap sidebar like the example?

I have seen the left hand ScrollSpy example on the bootstrap page: http://twitter.github.io/bootstrap/2.3.2/javascript.html#scrollspy But they don't have any example code of how to get the same style and effect? What is the minimum code needed to…
yazz.com
  • 52,748
  • 62
  • 227
  • 363
16
votes
6 answers

Bootstrap scrollspy offset on a fixed navbar does not work

I have created and exact fiddle of my problem here for testing: http://jsfiddle.net/aVBUy/7/ The issue is, when I click on navbar items, I have a script which scrolls to the element id. And I am using scrollspy to highlight the nav elements when…
Joshc
  • 3,675
  • 16
  • 72
  • 117
12
votes
5 answers

how to use scrollspy without using bootstrap

Does anyone know how to use scrollspy without using bootstrap? I am trying to get this to work in one of my projects using this repository: https://github.com/sxalexander/jquery-scrollspy but it just doesn't do what the bootstrap one does. The li…
r3plica
  • 11,412
  • 17
  • 75
  • 203
12
votes
2 answers

Bootstrap 3 - Scrollspy with sidebar

I am using Bootstrap 3. I want to recreate the same functionality as the sidebar in the documentation on the Bootstrap site. Below is my code, and it is also here: http://bootply.com/82119 Two problems. The sidebar items do not highlight as you…
mccannf
  • 16,374
  • 3
  • 48
  • 63
11
votes
2 answers

Bootstrap 4 scrollspy not working with Angular 4

I'm trying to implement scrollspy in Angular 4. I've imported jQuery and Bootstrap.js in .angular-cli.json file. Its not giving any error in the console. However active class is not getting applied to li element as…
Rahul Dagli
  • 3,613
  • 11
  • 40
  • 77
10
votes
3 answers

Bootstrap 4 scrollspy not working to change active navbar items

I am using Bootstrap 4.0 to create a simple landing page and using ScrollSpy in this page but I am not able to make it work, it does not changing the active menu items. index.html -
10
votes
3 answers

Bootstrap Scrollspy causes issues with Off-Canavas Menu

UPDATE: To clear up some confusion I added a fiddle that demonstrates how it is supposed to work, but it is just missing the scrollspy: https://jsfiddle.net/kmdLg7t0/ How can I add the scrollspyto this fiddle so that the menu highlights when I'm…
ChosenJuan
  • 821
  • 2
  • 18
  • 46
10
votes
4 answers

Scrollspy Using Full URL

I am trying to get scrollspy to work when using an absolute url rather than an # anchor link. For example, I can easily run scrollspy by using only I would like to be able to run scrollspy by using
SmashBrando
  • 255
  • 1
  • 3
  • 12
9
votes
3 answers

Bootstrap 3.0 scrollspy responsive offsets

I'm trying to get Bootstrap's scrollspy to work reliably on a responsive site on which the top navbar's height changes according to the width of the media/browser. So instead of hardcoding the offset on the data-offset attribute I'm setting it…
Ike
  • 773
  • 1
  • 7
  • 14
8
votes
2 answers

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…
Roger Johansson
  • 20,991
  • 14
  • 87
  • 174
7
votes
3 answers

bootstrap offset scrollspy not working

The navbar works as well as the smooth scroll, but I can not change the offset. My nav is 86px but no matter how many px I change it still goes to the same place. $(document).ready(function () { $('body').scrollspy({target: ".navbar", offset:…
JonW
  • 135
  • 1
  • 7
7
votes
1 answer

Prevent Bootstrap scrollspy from adding URL hash

I've implemented Bootstrap 3.0's scrollspy as follows:
im1dermike
  • 4,579
  • 8
  • 54
  • 104
6
votes
4 answers

How to implement a scrollspy with React

I want to implement a scrollspy without the bootstrap. I have checked a lot of code online, all of them are implemented by jQuery. How to implement the scrollspy only with the power of React?
leuction
  • 357
  • 2
  • 6
  • 17
6
votes
2 answers

How to use multiple target on body with Bootstrap ScrollSpy

I want to use Bootstrap ScrollSpy with multiple nav, my main nav and a vertical subnav. I tried multiple thing like :
Shad Gagnon
  • 475
  • 1
  • 7
  • 19
5
votes
1 answer

Bootstrap 4 how to remove first affix when second affix comes to view

I am using bootstrap 4 scrollspy and customized affix.Problem is when second menu comes to view i need to remove the first fixed menu. Check the fiddle here https://jsfiddle.net/raj_mutant/awknd20r/ html:
Pushparaj
  • 1,010
  • 8
  • 22
1
2 3
…
20 21