News Contents
信息中心

html5 手机自动播放

发表日期:2018/12/13      浏览次数:

1、audio:html5音频标签

<audio id="audios" src="https://dn-qtshe.qbox.me/LAMPHO%20-%20%E7%9F%AD%E5%8F%91.mp3" autoplay controls="controls">您的浏览器不支持 audio 标签。</audio>

不支持audio元素的浏览器会显示标签内文字

src:音频地址
autoplay:音频加载完毕后自动播放。
controls:显示播放控制条。
loop:播放完毕后会重复播放。
preload: auto 预加载音频视频。metadata 只预加载音频视频元数据。  有autoplay时此属性无效。

2、js控制媒体

play()播放
pause()暂停
load()重新加载

3、微信端和手机不能支持自动播放问题

原因是:android  ios 内部原因 为了节省流量,规定不自动播放音频视频

所以采用以下方式解决

//--创建页面监听,等待微信端页面加载完毕 触发音频播放
    document.addEventListener('WeixinJSBridgeReady', function() {        document.getElementById('audios').play()
    })
//--创建触摸监听,当浏览器打开页面时,触摸屏幕触发事件,进行音频播放
    document.addEventListener('touchstart', function() {        document.getElementById('audios').play()
    })



作者:一个被床封印的程序猿

盛大建站承接个人、公司、企业的网站建设、网页设计、网店制作、独立商城制作、外贸网站制作,也承接同行介绍的业务,欢迎联系!
本站承接主要业务如下:
1、提供免备案虚拟主机(网站空间),有独立国内服务器、高速美国服务器、香港服务器、韩国服务器、日本服务器,>> http://www.fuanxx.com
2、网站建设:个人网店制作、企业建站、公司网站、新闻、下载等;论坛、博客网站搭建,承接外贸英文站制作
3、承接阿里巴巴、京东、淘宝、天猫等的商品数据采集
4、网站防钓鱼,可以过360、QQ、搜狗、金山、微信拦截
5、要就发IP网站限制访问系统,防止同行抄袭并保障海外客户访问不受影响,>> http://www.198ip.com
  下一篇:没有了!
十年如一日,我们专注于提供高品质 定制网站建设服务!
您的信任,我们的责任,期待与您的合作!