Locomotive scroll is a simple scroll library, it provides smooth scrolling with support for parallax effects, toggling classes, and triggering event listeners when elements are in the viewport.
Questions tagged [locomotive-scroll]
111 questions
1
vote
1 answer
How to hide browser's scrollbar when using locomotive-scroll in React?
I've been trying to use locomotive-scroll to add the smooth scrolling feature to my website. I got it up and running well, however while scrolling, I notice that the browser's default scrollbar stays at the same place as the scrollbar from the…
Chan Huy Khuong
- 25
- 1
- 3
1
vote
3 answers
TypeError: Cannot read properties of null when using Locomotive Scroll with Next.js
I am trying to use locomotive scroll but but I get an error
I try to use react-locomotive-scroll but get the same error
My _app.tsx looks like this
Where is my mistake? I try to put inside layout component which wraps the entire page, but it…
PrinceLoren
- 81
- 1
- 6
1
vote
1 answer
Locomotive scroll sticky header
I found this codepen example using locomotive scroll and implementing sticky header.
Once I click and drag the smooth scrollbar, the sticky header stops working . What could be the reason ?
let options = {
el:…
Felix A J
- 6,300
- 2
- 27
- 46
1
vote
1 answer
Locomotive Scroll: Is it possible to use querySelector with an URL and an anchor tag?
The links in my navigation use URLs with an anchor-tag (f.e. mysite.com/about#cv). The reason being that i want to jump/scroll to a specific section even if i am not on the f.e. about-page.
Normally this works fine. But i am using the locomotive…
amnds
- 21
- 2
1
vote
1 answer
Call included function correctly
I'm using nuxt-locomotive-scroll with gsap and get following error.
_this.elementAnimation is not a function
How can I correctly call the elementAnimation() function which is included in initScrolltrigger()
export default {
mounted() {
…
PhilippeUn
- 190
- 2
- 16
1
vote
0 answers
How to correctly kill off and reinitialize ScrollTrigger? (Nuxt + LocomotiveScroll)
I'm using GSAP ScrollTrigger and LocomotiveScroll in a Nuxt application. Everything is working fine so far, except when changing routes.
I guess, I have to kill off and reinitialize LocomotiveScroll and ScrollTrigger?
The relevant JS:
export default…
P-at
- 11
- 4
1
vote
0 answers
Can't scroll down after using Locomotive Scroll
I'm making a home page and when I implement Locomotive Scroll it is stuck on my slider and I can't scroll down. I tried to hide my slider and it worked. Any idea why it's not working with my slider?
const scroller = new LocomotiveScroll({
el:…
vyvy
- 23
- 6
1
vote
0 answers
Update locomotive scroll component on route change with Vue.js (gridsome)
I built a component in VueJs/Gridsome for smooth page scrolling using locomotive-scoll. On initial page load or hard page reload it works fine, but not when just changing the route. I tried several ways like adding a key to the component or using…
Mark Herpich
- 11
- 1
1
vote
0 answers
Is it possible to have locomotive.js infinite loop when scrolling down?
I'm wondering if it's possible to make locomotive.js infinite loop to the start of the content when you reach the bottom?
monsaic123
- 241
- 2
- 11
1
vote
3 answers
TypeError: Cannot read property 'offsetHeight' of null when using the Locomotive Scroll react module
I am trying to load some images from firebase and have them scroll horizontally with the locomotive scroll react module. However, whenever I add the useEffect section below to initialise the locomotive scroll I get the following error:
I have…
Dov Royal
- 49
- 2
- 9
1
vote
1 answer
locomotive.js smooth scroll update() on load
I'm using locomotive.js (https://locomotivemtl.github.io/locomotive-scroll/) on a wordpress site.
It worked perfectly until I uploaded to a live server. On the live server the elements sometimes bump into each other and then flicker and disappear…
golds1981
- 31
- 1
- 4
1
vote
2 answers
Nuxt with LocomotiveScroll and Gsap
I've been struggling to implement locomotive-scroll and Gsap into a Nuxt project. Something I believe to do with the DOM and SSR. I checked all the docs from scrollproxy Gsap, to Nuxt and locomotive, but I have no more clues.
If you guys have any…
Kellig
- 13
- 6
1
vote
1 answer
Locomotive Scroll function trigger
Can someone tell me how to trigger a function when the element is in view in locomotive scroll, I am kind of noob, please explain in detail,
Thanks in advance
const counterFunc = () => {
counters.forEach((counter) => {
const updateCount = () =>…
Code Centrix
- 39
- 7
1
vote
1 answer
How to remove / reload locomotive scroll on window resize?
I have a website I'm building that uses a horizontal layout on desktop and switches back to a native vertical layout on smaller screens. I'm using locomotive scroll, which is working great, but I can't seem to get the window resizing down.
Here is…
yerme
- 810
- 5
- 15
0
votes
0 answers
Mousefollower is not hovering over the other components
i have used mousefollower to hover all over my landing page but it doesn't hover when I scroll down and over other components. it only stays from top to 100vh, but doesn't appear when I scroll down and hover over other components.
this is the…
Naim Fury
- 9
- 2