content
content copied to clipboard
doka-guide
Создаём нормальный range
Я готов взяться. Однако возникает вопрос. Если использовать только css, то там достаточно мало возможностей сделать что-то полезное, так как поддержка псевдоэлементов во всех браузерах разная, более того в них есть баги. И единственный способ красиво стилизовать рэндж только с использованием js. Это нормально в разделе про css упоминать js. Ну например показать все возможности стилизации с помощью css, а потом сказать: "Для более сложных реализаций придется использовать js" и уже показывать реализацию с использованием js?
Материал по данной теме:
- https://css-tricks.com/styling-cross-browser-compatible-range-inputs-css/
- https://codepen.io/collection/DgYaMj/
- https://github.com/w3c/csswg-drafts/issues/4410
- https://www.codingnepalweb.com/price-range-slider-html-css-javascript/
- https://www.codingnepalweb.com/custom-animated-range-slider-javascript/
- https://developer.mozilla.org/ru/docs/Web/HTML/Element/input/range
- https://codepen.io/hari_shanx/pen/BNyzvj/?editors=1100
- https://css-tricks.com/value-bubbles-for-range-inputs/
- https://blog.logrocket.com/creating-custom-css-range-slider-javascript-upgrades/
- https://www.sitepoint.com/css-custom-range-slider/
- https://www.youtube.com/watch?v=EomWt4Dc5xg
- https://codepen.io/long-lazuli/pen/NPEPyM
- https://roundsliderui.com/demos.html#various-circle-shapes
- https://www.cssportal.com/style-input-range/
Привет! Здорово, что ты готов взяться. А чтобы тебя не ограничивал раздел, я сейчас перенесу ишью в Рецепты. Там ты сможешь использовать все доступные инструменты, включая JS =)