介绍 html是什么 <李> <李> <李> _Music.prototype.playMusic =,函数(){var _this =,, this.play.on(& # 39;点击# 39;,,函数(){if (_this.audio.paused), {
,,,,,,,,,,,_this.audio.play ();
$(this).html('');
,,,,,,,},{else
,,,,,,,,,,,_this.audio.pause ();
$(this).html('')
,,,,,,,}
,,,});
} _Music.prototype.volumeDrag =,函数(){var _this =,, this.btn.on (& # 39; mousedown& # 39;,,函数(){
,,,,,,,_this.clicking =,真的;
,,,,,,,_this.audio.pause ();
,,,})this.btn.on (& # 39; mouseup # 39;,,函数(){
,,,,,,,_this.clicking =,假;
,,,,,,,_this.audio.play ();
,,,})this.progress.on (& # 39; mousemove 点击# 39;,,函数(e){如果(_this.clicking | |, e.type ===, & # 39;点击# 39;){var len =,(这)美元.width (),
,,,,,,,,,,,,,,,left =, e.pageX 作用;美元(这).offset () .left,
,,,,,,,,,,,,,,,volume =, left /, len;如果(volume & lt;=, 1, | |, volume 祝辞=,0){
,,,,,,,,,,,,,,,_this.audio.currentTime =,, volume *, _this.audio.duration;
,,,,,,,,,,,,,,,_this.progressLine.css(& # 39;宽度# 39;,,volume * 100, + & # 39; % & # 39;);
,,,,,,,,,,,}
,,,,,,,}
,,,});
} _Music.prototype.readyLyric =,函数(抒情){this.lyricBox.empty (); var lyricLength =, 0; var html =, & # 39; & lt; div 类=發yric-ani", data-height=?0“祝辞& # 39;;
,,,lyric.forEach(函数(元素、索引),{var ele =,元素[1],===,undefined ?, & # 39; ^ _ ^歌词错误^ _ ^ & # 39;,:,,元素[1];
,,,,,,,html +=, & # 39; & lt; p 类=發yric-line",数据id=? # 39; +指数+ & # 39;“,data-time=? # 39;, +,元素[0],+,& # 39;“祝辞,& # 39;,+,,ele +, & # 39;, & lt;/p> & # 39;;
,,,,,,,lyricLength + +;
,,,});
,,,html +=, & # 39; & lt;/div> & # 39;; this.lyricBox.append (html); this.onTimeUpdate (lyricLength);
}
这篇“如何使用html5制作音乐播放器”除了程序员外大部分人都不太理解,今天小编为了让大家更加理解”如何使用html5制作音乐播放器”,给大家总结了以下内容,具有一定借鉴价值,内容详细步骤清晰,细节处理妥当,希望大家通过这篇文章有所收获、下面让我们一起来看看具体内容吧。
html的全称为超文本标记语言,它是一种标记语言,包含了一系列标签。通过这些标签可以将网络上的文档格式统一,使分散的互联网资源连接为一个逻辑整体,html文本是由html命令组成的描述性文本,html命令可以说明文字,图形,动画,声音,表格,链接等,主要和css + js配合使用并构建优雅的前端网页。
相关技能
<代码> HTML5 + CSS3> <李>
<代码> Iconfont> <李>
<代码> 少(动态css编写)
<李><代码> jQuery代码> <李>
<代码>杯+ webpack>
实现的功能
播放暂停(点击切换播放状态)
<李>下一曲(切换下一首)
<李>随机播放(当前歌曲播放完自动播放下一曲)
<李>单曲循环(点击随机播放图标可切换成单曲循环)
<李>音量调节(鼠标移入滑动设置音量大小)
<李>歌曲进度条(可点击切换进度直接跳,也可以点击小圆点拖拽切换进度)
<李>实时歌词(点击词,切换歌词界面,根据实时进度自动滚动歌词)
<李>喜欢(点击添加了一个活跃的效果)
<李>分享(可以直接分享到新浪微博)
音频标签使用
<代码>播放自动播放
<李><代码> 循环循环播放
<李><代码> 音体积量设置
<李><代码> currentTime 当前播放位置
<李><代码>时间> <李>
<代码> 暂暂停停
<李><代码> 玩播放
<李><代码> 结束返回音频是否已结束
