想做一个音乐播放器界面,单纯切图,请问下
红圈处的这个表示音乐播放时间应该用什么标签表示
用 <time> 和 <small 好了
貌似看得比较多的一般都是用 <span>
或者 <div>
贴一个来自 stackoverflow 的实现例子:
<audio id='audioTrack' ontimeupdate='updateTrackTime(this);'>
Audio tag not supported in this browser</audio>
<script>
// 更新时间
function updateTrackTime(track){
var currTimeDiv = document.getElementById('currentTime');
var durationDiv = document.getElementById('duration');
var currTime = Math.floor(track.currentTime).toString();
var duration = Math.floor(track.duration).toString();
currTimeDiv.innerHTML = formatSecondsAsTime(currTime);
if (isNaN(duration)){
durationDiv.innerHTML = '00:00';
}
else{
durationDiv.innerHTML = formatSecondsAsTime(duration);
}
}
// 格式化时间
function formatSecondsAsTime(secs, format) {
var hr = Math.floor(secs / 3600);
var min = Math.floor((secs - (hr * 3600))/60);
var sec = Math.floor(secs - (hr * 3600) - (min * 60));
if (min < 10){
min = "0" + min;
}
if (sec < 10){
sec = "0" + sec;
}
return min + ':' + sec;
}
</script>
获取播放时间的API参考: HTML5 Audio 标准