博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
兼容大部分手机端的音乐播放代码
阅读量:6037 次
发布时间:2019-06-20

本文共 1464 字,大约阅读时间需要 4 分钟。

html部分

js部分

//兼容大部分的app,微信和浏览器的音乐后台播放。    document.addEventListener('DOMContentLoaded', function() {        // 音乐播放        function autoPlayMusic() {            var audio = document.getElementById('bg-music');            audio.play();            document.addEventListener("WeixinJSBridgeReady", function() {                audio.play();            }, false);            // 自动播放音乐效果,解决浏览器或者APP自动播放问题            function musicInBrowserHandler() {                musicPlay(true);                document.body.removeEventListener('touchstart', musicInBrowserHandler);            }            document.body.addEventListener('touchstart', musicInBrowserHandler);            // 自动播放音乐效果,解决微信自动播放问题            function musicInWeixinHandler() {                musicPlay(true);                document.addEventListener("WeixinJSBridgeReady", function() {                    musicPlay(true);                }, false);                document.removeEventListener('DOMContentLoaded', musicInWeixinHandler);            }            document.addEventListener('DOMContentLoaded', musicInWeixinHandler);        }        function musicPlay(isPlay) {            var media = document.querySelector('#bg-music');            if (isPlay && media.paused) {                media.play();            }            if (!isPlay && !media.paused) {                media.pause();            }        }        autoPlayMusic();    });

 

转载于:https://www.cnblogs.com/zsl123/p/6835901.html

你可能感兴趣的文章
.Net规则引擎介绍 - REngine
查看>>
微信消息回复C#
查看>>
JVM学习03_new对象的内存图讲解,以及引出static方法(转)
查看>>
I深搜
查看>>
c++面向对象的编程
查看>>
ArcMap概化之消除真曲线
查看>>
[禅悟人生]谦虚有助于自我消融
查看>>
MFC之自绘控件
查看>>
为EXSi5.5上的Centos虚机增加硬盘容量
查看>>
算法提高 道路和航路 SPFA 算法
查看>>
Golang 如何从socket读出所有数据
查看>>
iOS开发使用半透明模糊效果方法整理
查看>>
一道图论小题目
查看>>
Win7启动修复MBR(Win7+Linux删除Linux后进入grub rescue的情况)
查看>>
struts2.xml中所有constant详解--大全
查看>>
Hibernate拦截器(Interceptor)与事件监听器(Listener)
查看>>
关于android im
查看>>
CSS3 transforms 3D翻开
查看>>
利用传入的Type类型来调用范型方法的解决方案
查看>>
Top命令内存占用剖析
查看>>