
Reblogged by collinsworth@hachyderm.io ("Josh Collinsworth"):
css@front-end.social ("CSS by T. Afif :verified:") wrote:
💡 CSS Tip!
Using scroll-driven animations, you can link a CSS variable with a range slider and easily update its value!
No more JavaScript to do this. A few lines of CSS, one HTML element and you can update any value in real time.
It's chrome only for now but I am sure this will be one of the most used feature in 2 or 3 years.
Demo: https://codepen.io/t_afif/full/GRbawQm via :codepen: @codepen
Online Version: https://css-tip.com/css-variables-range-slider/