<!DOCTYPE html>
right: 0.22rem;
z-index: 6666;
}
</style>
<body>
<div id="btn">
<audio id="audio-player"ref="audio"preload="preload"autoplay="autoplay"loop="loop">
<source src="music.163/song/media/outer/url?id=1840182219"type="audio/mpeg"> Your browser does not support the audio tag.
</audio>
</div>
</body>
</html>
<script>
let isWeixin=()=>{
html播放音乐代码let ua = window.LowerCase()
return;
/micromessenger/
.test(ua)
}
// method ⾃动播放
let audioPlayer=(id)=>{
let audio = ElementById(id)
if(isWeixin()){
document.addEventListener(
'WeixinJSBridgeReady'
,()=>{
audio.play()
},false);
// 添加 getNetworkType 的判断原因, 请看问题分析2
if(typeof window.
WeixinJSBridge
==
"object"
&&typeof window.
WeixinJSBridge
.invoke ==
"function"
){
window.
WeixinJSBridge
.invoke(
'getNetworkType'
,{},()=>{
audio.play()
})
}
}else{
// audio.play();
let touchPlay=()=>{
audio.play();
'touchstart'
, touchPlay,false)
};
if(audio.paused){
document.addEventListener(
'touchstart'
, touchPlay,false)
}
}
}
// 使⽤
audioPlayer(
'audio-player'
);
var audio = ElementById("audio-player");
var btn = ElementById("btn");
var rotateVal =0;
var InterVal;// 定时器
// 设置定时器
function rotate(){
InterVal =setInterval(function(){
InterVal =setInterval(function(){
rotateVal +=4;
// 设置旋转属性(顺时针)
ansform ='rotate('+ rotateVal +'deg)';
/
/ 设置旋转属性(逆时针)
//ansform = 'rotate(-' + rotateVal + 'deg)'
// 设置旋转时的动画匀速0.1s
ansition ='0.1s linear'
},100)
}
// rotate();
if(audio.paused){//判断当前的状态是否为暂停,若是则点击播放,否则暂停 audio.play();
rotate()
}else{
audio.pause();
clearInterval(InterVal)
}
};
</script>
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论