Add Class to Element when Scrolled into View
A very basic demo that adds a class to an element when it scrolls to an arbitrary distance from the top of the viewport.
In the related image switch demo, the addition of a class reveals a hidden image, that is positioned over another image, to create a before and after effect.
Works in modern browsers and IE9+
Please view the source of this page for HTML markup, CSS and JS.
Scroll Down...
The boxes below change colour...
Related
- Add Class to Target-Element when Trigger-Element is Scrolled into View (with Throttle and Debounce)
- Add Class to Target-Element when Trigger-Element is Scrolled into View (Reduced - no Throttle or Debounce)
- Add Class to Element when Scrolled into View (with Throttle and Debounce)
- Add Class to Element when Scrolled into View (Reduced - no Throttle or Debounce)
More demos and snippets
Did you find this useful? There are more demos and code snippets this way.