markmead / alpinejs-sticky Goto Github PK
View Code? Open in Web Editor NEWToggle CSS class names when an element becomes sticky to the DOM ๐
Home Page: https://js.hyperui.dev/examples/utility-update-class-when-sticky
License: MIT License
Toggle CSS class names when an element becomes sticky to the DOM ๐
Home Page: https://js.hyperui.dev/examples/utility-update-class-when-sticky
License: MIT License
https://js.hyperui.dev/examples/utility-update-class-when-sticky opened in latest Brave browser (Chromium):
Hi Mark,
I took this for a spin on a project recently, thanks for sharing!
Couple of ideas/issues:
In my testing I found it didn't play nicely with a sticky element at the very top of the browser viewport. It would always trigger the x-sticky
classes even if I was yet to scroll down the page, perhaps this was just my project though (I was hoping to find the time to setup a minimal test case). FWIW I had a play with both the root margin and threshold settings but I wasn't able to resolve it.
It would be nice to be able to configure some classes that get applied in the non-sticky state (and removed when sticky) and then some classes that are applied when the element is sticky, just so that I don't need to use !important
classes to override existing ones.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.