css , 1 month ago Using modern CSS features to create a custom range slider with a tooltip. There is no JS to update the values, it's pure CSS with minimal HTML 😎 Powered by Scroll Driven animation, Anchor positioning, @property and more! 🤩 Demo: https://codepen.io/t_afif/full/JjqNEbZ via :codepen: @codepen Online Version: https://css-tip.com/range-slider-tooltip/ It's Chrome only for the tooltip but the range slider works fine in all the browsers. #CSS #HTML Showing two range slider with a tooltip containing the selected values. From the linked demo.
Using modern CSS features to create a custom range slider with a tooltip. There is no JS to update the values, it's pure CSS with minimal HTML 😎
Powered by Scroll Driven animation, Anchor positioning, @property and more! 🤩
Demo: https://codepen.io/t_afif/full/JjqNEbZ via :codepen: @codepen
Online Version: https://css-tip.com/range-slider-tooltip/
It's Chrome only for the tooltip but the range slider works fine in all the browsers.
#CSS #HTML
Showing two range slider with a tooltip containing the selected values. From the linked demo.