我可以将输入范围变成音频播放器吗?以及如何 link 按钮?
Can I turn the input range into an audio player? and How do I link the buttons?
我一直在尝试弄清楚是否可以将输入滑块变成音频播放器。就是带有 (class = "progress-bar")
的那个。
这是基本设计。
我不确定是否可行,但我会指出正确的方向来完成这个音乐播放器。
<section class="container">
<div class="Song-Photo">
<img src="https://th.bing.com/th?id=OIF.%2fA7TZqecnjxCdpKO6nnZ3w&pid=ImgDet&rs=1" alt="Kung-Fu Kenny">
</div>
<div class="Music-Player">
<div class="Song-Title">Heart Part V</div>
<span id="Audio-Player">
<div class="current-time"> Current-Time </div>
<input id="Audio-Player" class="progress-bar" min="0" max="0" type="range">
<div class="duration">Duration</div>
<button class="mute">Mute</button>
<input id="Audio-Player" class="volume" type="range" min="0" max="100">
</span>
<div id="button-functions" class="Audio-Playback">
<button id="button-functions" class="rewind">Rewind</button>
<button id="button-functions" class="play-pause">Play</button>
<button id="button-functions" class="fast-forward">Fast-Forward</button>
<button id="button-functions" class="random-shuffle-repeat">Shuffle/Repeat</button>
</div>
<div class="Artist">Kendrick Lamar</div>
</div>
</section>
变成音频播放器是什么意思?
一个音频播放器是这样的:
<figure>
<figcaption>Listen to the T-Rex:</figcaption>
<audio
controls
src="/media/cc0-audio/t-rex-roar.mp3">
Your browser does not support the
<code>audio</code> element.
</audio>
</figure>
如果你想将输入滑块变成音频播放器,我猜替换为上面的代码。
我一直在尝试弄清楚是否可以将输入滑块变成音频播放器。就是带有 (class = "progress-bar")
的那个。
这是基本设计。
我不确定是否可行,但我会指出正确的方向来完成这个音乐播放器。
<section class="container">
<div class="Song-Photo">
<img src="https://th.bing.com/th?id=OIF.%2fA7TZqecnjxCdpKO6nnZ3w&pid=ImgDet&rs=1" alt="Kung-Fu Kenny">
</div>
<div class="Music-Player">
<div class="Song-Title">Heart Part V</div>
<span id="Audio-Player">
<div class="current-time"> Current-Time </div>
<input id="Audio-Player" class="progress-bar" min="0" max="0" type="range">
<div class="duration">Duration</div>
<button class="mute">Mute</button>
<input id="Audio-Player" class="volume" type="range" min="0" max="100">
</span>
<div id="button-functions" class="Audio-Playback">
<button id="button-functions" class="rewind">Rewind</button>
<button id="button-functions" class="play-pause">Play</button>
<button id="button-functions" class="fast-forward">Fast-Forward</button>
<button id="button-functions" class="random-shuffle-repeat">Shuffle/Repeat</button>
</div>
<div class="Artist">Kendrick Lamar</div>
</div>
</section>
变成音频播放器是什么意思?
一个音频播放器是这样的:
<figure>
<figcaption>Listen to the T-Rex:</figcaption>
<audio
controls
src="/media/cc0-audio/t-rex-roar.mp3">
Your browser does not support the
<code>audio</code> element.
</audio>
</figure>
如果你想将输入滑块变成音频播放器,我猜替换为上面的代码。