darkroomengineering / lenis

How smooth scroll should be

Home Page:https://lenis.darkroom.engineering

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Scroll wheel not working

ccrch opened this issue · comments

I've already reported this once before but the setup where Lenis was used was quite complicated & hard to debug.

Was trying to figure it out again recently, with some simple esbuild setup - same issue.
So I've set up this super simple, basic example here - http://ccrch.com/lenis-test.html
Loading the script from cdn, then just initialiazing it inline. Minimal css. Still doesn't work.
Script loads, console log registers events, but actual mouse wheel doesn't do anything.
Any idea what could be an issue?

lenis-test

Weirdly enough - when I copy/paste whole markup into ie. codepen - it works.

I was using Lenis on bunch of sites, ie. https://www.netgiro.is/, https://www.preventncd.eu/, https://npi-umbraco.azurewebsites.net/ with pretty much exactly same esbuild setup, and it just works with no problems whatsoever.

That's is weird indeed, this codepen works. It seems that your default scroll is body instead of documentElement by checking document.scrollingElement. The scrollingElement documentation says that body is the default scroller when your page is in "quirks mode". I think you're missing the <!doctype html>

Anyway i can fix it on lenis codebase by scrolling the scrollingElement instead of the rootElement but i don't see any reason to remove the <!doctype html>. https://heitorhherzog.medium.com/what-happens-when-you-remove-doctype-from-the-html-page-b062e6a0beec

Omg. <!doctype html> does the trick!
Thank you so much for the quick reply. 😄

@ccrch you're welcome, just learned about this actually. Did you remove it on purpose or did you just forget to add it, or maybe esbuild doesn't add by default ?

I had it in every other setup except for this one. Heh, it's always those small things. 2-3 hrs of figuring it out with 1 short line of code. 😆

Ok, I think it doesn't make sense to adapt lenis to this issue since this is not standard