Q&A
vueを使っているのでこちらで再現できそうです！ありがとうございます！m(_ _)m
<input type="range">で音楽プレイヤーを作っており、inputタグのmaxを曲の再生総時間として設定し、現在の時間をつまみで表現しようと考えています。なので、現在の時間が進むと共に、つまみも動かしたいです。
しかし検索してみても、inputタグに入力された値を利用した記事(現在の値を表示するなど）は見つかるのですが、
現在の値をjsなどで移動させるものがなかなか見当たりません。
input type rangeのつまみを動的に移動させることはそもそもできず、他の方法でやるべきでしょうか？
回答2件
0
Chromeで試したのですが、
例えば以下のように、value属性の値によってつまみ部分を動かすことができるようです。
HTML
1<input type="range" id="range" value="0">
JavaScript
1// 「現在位置 / 曲の長さ * 100」を代入すると、移動できそうです。 2document.getElementById('range').value = 75;
投稿2020/04/25 13:38
総合スコア4528
0
ベストアンサー
Vueを利用していると思うので
v-modelを活用することで実装できます
変数の中身を動的に変えることでつまみ部分も移動します
https://codepen.io/Angelpsy/pen/mApRqJ
このサンプルが役に立つと思います
投稿2020/04/25 13:42
総合スコア759
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/04/25 13:48