百分百源码网-让建站变得如此简单! 登录 注册 签到领金币!

主页 | 如何升级VIP | TAG标签

当前位置: 主页>网站教程>html5教程> H5视频中配景音乐怎样主动播放-
分享文章到:

H5视频中配景音乐怎样主动播放-

发布时间:08/01 来源:未知 浏览: 关键词:
这次给大家带来H5视频中配景音乐怎样主动播放,H5视频中配景音乐主动播放的注意事项是什么,下面就是实战案例,一起来看一下。 这次给大家带来H5视频中配景音乐怎样主动播放,H5视频中配景音乐主动播放的注意事项是什么,下面就是实战案例,一起来看一下。

音乐的主动播放属性,这里也介绍一下:

  
  
Your browser does not support the audio element.

autoplay 属性规定一旦音频就绪即将开端播放。

要是设定了该属性,音频将主动播放。

但是在现实使用中,时常会碰到不克不及主动播放的现象,主如果由于有些阅读器或者手时机阻止或不支撑autoplay这个属性,在这里我介绍一下我采纳的办法。

第一:在html中代码如下





在js文件中采纳如下代码

var audio = document.getElementById('music1');
$("#btn").bind("touchstart", function bf() {
if(audio !== null) {
//检测播放可否已暂停.audio.paused 在播放器播放时返回false.
//alert(audio.paused);
if(audio.paused) {
audio.play(); //audio.play();// 这个就是播放
$("#btn").addClass("active")
} else {
audio.pause(); // 这个就是暂停
$("#btn").removeClass("active")
}
}
})

写到了这里大局部安卓机就根本可以实现主动播放了,但是iphone手机在这个时候还是不过关的

这里我采纳了一个在加载页中参加一个按钮,当加载完成的时候,点击按钮,指导会员完成配景音乐的主动播放,代码如下:

$("html").one('touchstart',function(){
audio.play();
})

到了这里就实现了配景音乐的主动播放,这个方法适用于有加载页,而且需要点击进入h5的项目......

信赖看了本案牍例你已经把握了办法,更多出色请关注 百分百源码网 其它相干文章!

举荐浏览:

H5在Canvas中实现自定义途径动画

在H5页面中如何调取APP

运用canvas实现视频里的弹幕结果

以上就是H5视频中配景音乐怎样主动播放的细致内容,更多请关注 百分百源码网 其它相干文章!

打赏

打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,你说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

百分百源码网 建议打赏1~10元,土豪随意,感谢您的阅读!

共有150人阅读,期待你的评论!发表评论
昵称: 网址: 验证码: 点击我更换图片
最新评论

本文标签

广告赞助

能出一分力是一分吧!

订阅获得更多模板

本文标签

广告赞助

订阅获得更多模板