croc,
@croc@mastodon.social avatar

Couldn't find an existing multi-handle range slider built as a HTML Web Component, so I converted an existing regular multi-handle range slider to a Web Component and learned a lot about the process of building custom Web Components. Fun!

https://gist.github.com/crock/385825f81203fb6986efbb078705027b

westbrook, (edited )
@westbrook@mastodon.social avatar

@croc Nice work! Building IS fun, isn't it?

Have you looked into how leveraging an <input type="range"> under the covers for each handle supports easier interactions for keyboard and screen reader users?

My team approaches this situation with the following implementation: https://opensource.adobe.com/spectrum-web-components/components/slider-handle/#range-slider The underlying code is a bit of a mess right now, however. 😞

croc,
@croc@mastodon.social avatar

@westbrook I definitely want to look more into making this accessible, but for now I just converted someone else’s library to be in Web Component format. Was quite a bit of moving stuff around already.

I'm gonna check your link out! :D

  • All
  • Subscribed
  • Moderated
  • Favorites
  • random
  • ngwrru68w68
  • rosin
  • GTA5RPClips
  • osvaldo12
  • love
  • Youngstown
  • slotface
  • khanakhh
  • everett
  • kavyap
  • mdbf
  • DreamBathrooms
  • thenastyranch
  • magazineikmin
  • megavids
  • InstantRegret
  • normalnudes
  • tacticalgear
  • cubers
  • ethstaker
  • modclub
  • cisconetworking
  • Durango
  • anitta
  • Leos
  • tester
  • provamag3
  • JUstTest
  • All magazines