代码如下
$(document).ready(function () {
var audioElement = document.createElement('audio');
audioElement.setAttribute('src', $('.active-song').attr('data-src'));
var tl = new TimelineMax();
tl.to('.player__albumImg', 3, {
rotation: '360deg',
repeat: -1,
ease: Power0.easeNone
}, '-=0.2');
tl.pause();
//这是页面刷新之后音乐自动播放
if ($('.player').hasClass('play')) {
$('.player').removeClass('play');
audioElement.pause();
TweenMax.to('.player__albumImg', 0.2, {
scale: 1,
ease: Power0.easeNone
})
tl.pause();
} else {
$('.player').addClass('play');
audioElement.play();
TweenMax.to('.player__albumImg', 0.2, {
scale: 1.1,
ease: Power0.easeNone
})
tl.resume();
}
$('.player__play').click(function () {
if ($('.player').hasClass('play')) {
$('.player').removeClass('play');
audioElement.pause();
TweenMax.to('.player__albumImg', 0.2, {
scale: 1,
ease: Power0.easeNone
})
tl.pause();
} else {
$('.player').addClass('play');
audioElement.play();
TweenMax.to('.player__albumImg', 0.2, {
scale: 1.1,
ease: Power0.easeNone
})
tl.resume();
}
})
在谷歌浏览器中会报错
DOMException: play() failed because the user didn't interact with the document first
先去百度,你把错误代码一粘贴,全世界都是答案,Chrome 66 禁止声音自动播放,开发怎么应对?