网站首页 美食营养 游戏数码 手工爱好 生活家居 健康养生 运动户外 职场理财 情感交际 母婴教育 时尚美容

html5的audio如何兼容各浏览器实现自动播放

时间:2024-10-27 04:16:22

1、布局DOM结构,准备好音频文件。当然html5的audio标签支持的音频格式是OGG,MP3, WAV,如果想各个浏览器兼容,需要将三种格式都转化一下。这里只做个演示,只转了MP3格式。<div class="musicPlay"><audio id="voice" autoplay="autoplay"><source src=”http://vk88.vka88.com/00006/2017063014590719381_Stay the Night.mp3.ogg” /><source src=”http://vk88.vka88.com/00006/2017063014590719381_Stay the Night.mp3.mp3″ /><source src=”http://vk88.vka88.com/00006/2017063014590719381_Stay the Night.mp3.wav” /></audio></div>

html5的audio如何兼容各浏览器实现自动播放

3、让safari浏览器也能够实现自动播放时,需要兼听“touchstart”事件。还需要分配一个变量,记录状态。所以针对iphone的微信端之后,再添加如下代码: var voiceStatus = true; document.addEventListener("touchstart", function(e) { if (voiceStatus) { voice.play(); voiceStatus = false; } }, false);

html5的audio如何兼容各浏览器实现自动播放
© 2025 小知经验
信息来自网络 所有数据仅供参考
有疑问请联系站长 site.kefu@gmail.com