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.

346 questions
1
vote
0 answers

How to add a class when another class is active

I have an anchor menu and when the anchor link is active it adds a class to that link. I'm trying to add an additional class to each anchor link individually when it's active, so I can make different changes to each one. Following is my anchor menu…
wondering
  • 56
  • 10
1
vote
0 answers

Can't get Bootstrap Scrollspy working on React

Hi I'm trying to get scrollspy working on React using Bootstrap but I seem to struggle to make it work. I have tried several ways to do this but I really have no idea how to make this work and it'll be much appreciate if you can help me with…
Sasa
  • 11
  • 2
1
vote
0 answers

Scrollspy using Alpinejs and intersect plugin

I have a website I'm working on that utilizes DaisyUI and Alpine.js (with intersect plugin). In one of my templates I have a stepper with sections of content relating to each step. When you click one of the steps to the stepper, it scrolls you to…
jtomeck
  • 169
  • 1
  • 12
1
vote
1 answer

Why is IntersectionObserver triggered well before in viewport?

IntersectionObserver seems to be triggering well before it should in my scenario (yes, I've read quite a few Q&A's here and several guides published around the place). I'm applying a class after an observed element leaves the viewport. This works in…
Erland
  • 123
  • 10
1
vote
0 answers

Scrollspy Vanilla Vertical Menu Overflow-Y:scroll menu

I'm doing something with Scrollspy Vertical Menu. But I ran into a problem and couldn't find a solution. when I scroll, I want it to follow the nav on my sidebar slider. Because I can't see what part he's in when there's a lot of sections. how can I…
Jolie
  • 11
  • 2
1
vote
0 answers

Scrollspy component [Trigger events and animations while scrolling the page.]

I want a component listens to page scrolling and trigger events based on the scroll position. Like this: https://getuikit.com/docs/scrollspy I have tried to use scrollspy from Bootstrap 5.1 but I didn`t find a way to achieve what I want.
BrbGrg
  • 21
  • 5
1
vote
0 answers

How to utilize ScrollSpy Bootstrap to automatically scroll overflow-x horizontal navigation

Looking for some assistance with my current horizontal scrolling nav with utilization of Bootstraps ScrollSpy. I have many items in my navigation for a clean timeline effect. However, I would love for the .nav-link item to automatically scroll the…
Chris 7
  • 70
  • 6
1
vote
0 answers

How to get DOM elements added dynamically

I am using Anchorjs with Bootstrap scrollspy (or at least trying to!). AnchorJS adds id to each element on DOMContentLoaded: document.addEventListener('DOMContentLoaded', function (event) { const anchors = new AnchorJS(); anchors.add('.post…
alias51
  • 8,178
  • 22
  • 94
  • 166
1
vote
0 answers

How can I offset a single link in Scrollspy navigation?

I'm using the Boostrap scrollspy for my onpage navigation. Every link has an offset of 70 pixels. But for one single nav item I need a different offset of 140 pixels. Is there a way to do this? $(function() { $('body').scrollspy({ target:…
Cray
  • 5,307
  • 11
  • 70
  • 166
1
vote
0 answers

Why scrollspy click not working on chrome

i had a scollspy page, my nav menu has a lot of items and nav items scroll to left or right when i scroll or click on nav links in firefox everything is Ok. but in chrome : when click on nav item, function not working, just on scrolling worked ! How…
ehsan
  • 38
  • 4
1
vote
1 answer

Scrolling horizontal menu while scrolling in React JS app

I’m dealing with problem with horizontal menu in my React JS application. I use react-scroll for smooth scroll and scroll spy, so the menu links are highlighted when encountering the section. Everything works fine, but I need to move the menu in the…
DavidKv
  • 35
  • 4
1
vote
0 answers

Bootstrap 5 scrollspy when accessing from another page

This was a question previously here Bootstrap scrollspy when accessing from another page But that's jquery and I converted it to Javascript but is not working for me. Can you guys help me, please? fixScrollSpy() { var stripped_url =…
Blaq
  • 11
  • 2
1
vote
1 answer

Scrollspy active not working with bootsrap 5

I need a help. I used the code from Bootstrap example but it didn't work. I put data target on Javascript, and i also put data-target on body. The code is full copy from bootstrap-5 scrollspy, but i don't completely understand how to use it. Thank…
lynn
  • 23
  • 1
  • 3
1
vote
0 answers

How can I implement vertical scroll snapping with `IntersectionObserver`?

I am inspired by Rolls Royce website and want to implement the same scroll snapping feature in mine as well, I did it with the HTML default scroll-snap-type which gives me expected behavior but creates two scrollbars, one for the container and…
krypton
  • 367
  • 1
  • 4
  • 13
1
vote
1 answer

React native Top Tap bar scrollable to specific section in a list?

If the user is scrolling down to Dinner option in the scroll view, then the DINNER icon should get highlighted in the tab. Similarly if the user clicks on Breakfast, it should automatically make the scroll view to move to that breakfast section.…
Nizami
  • 227
  • 1
  • 5
  • 15
1 2 3
…
23 24