input type="range" のカスタマイズ

[hiz8]

range タイプの input のデザインをカスタマイズした。
が…闇が深い…。

これらの記事を参考に、各ブラウザで近い見た目となるようCSSをいじりまくる必要があった。

• input type="range"のいろいろなCSSサンプル - Qiita
• input type=range タグをカスタマイズするために | g200kg Music & Software

また、特に以下の記事がその闇がとても分かりやすく、大変勉強になった。
控えめに言ってヤバイ。
でもなんだろうか…一昔前のWebっぽく、微笑ましくもある。

• input type=range タグをカスタマイズするために | g200kg Music & Software

がしかし、この部分の為だけにフレームワークを導入したいくらい難儀であった。
今回はこだわりたい部分でもあり…なかなか悩ましい問題だ。