Html5 audio标识款式的改动

日期:2021-02-24 类型:科技新闻 

关键词:小程序开发者工具,小程序在线生成平台,小程序编辑,免费的小程序,微信小程序在哪里

先给大伙儿详细介绍下HTML5中的新元素标识
src:声频文档相对路径。
autobuffer:设定是不是在网页页面载入时全自动缓存声频。
autoplay:设定声频是不是全自动播发。
loop:设定声频是不是要循环系统播发。
controls:特性供加上播发、中止和声音控制。
因为html5的时兴,如今挪动端大多数数的要求都可以以应用audio来播发声频,但您将会只是必须很简易的播发/终止实际效果,但不一样的访问器上的audio款式却不尽如人意,因此我简易的把它开展了封裝,实际效果以下:


做为技术性完成,它的基本原理较为简易,便是把原生态的audio掩藏,随后用div来显示信息播发器的实际效果,随后启用它的click恶性事件来开启play和stop,随后是时长duration,这个值有时可以获得,有时不好,较为坑,因此提议在audio标识上自定duration特性储放时长,这时候,假如组件获得不到时会来取这个值。

拷贝编码
编码以下:

this.settings.target.on('loadedmetadata', function() {
_this.duration = _this.audio.duration;
if (_this.duration != "Infinity") {
_this.durationContent.html(Math.floor(_this.duration) + 's');
} else {
var attr = $(_this.settings.target).attr('duration');
if(attr){
_this.durationContent.html($(_this.settings.target).attr('duration')+"s");
}else{
_this.durationContent.html('');
}
}
});

以上內容给大伙儿详细介绍了Html5 audio标识款式的改动 ,期待对大伙儿有一定的协助。