JQ实现音乐插件并自动播放

这里分享我最近写出来的一个小东西，基于jq的音乐播放器，可以嵌套到网站

效果截图：

具体首页代码如下：

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1" />
	<title></title>
	<link rel="stylesheet" href="css/player.css">
</head>
<body>
<div id="QPlayer">
<div id="pContent">
	<div id="player">
		<span class="cover"></span>
		<div class="ctrl">
			<div class="musicTag marquee">
				<strong>Title</strong>
				 <span> - </span>
				<span class="artist">Artist</span>
			</div>
			<div class="progress">
				<div class="timer left">0:00</div>
				<div class="contr">
					<div class="rewind icon"></div>
					<div class="playback icon" id="play-btn"></div>
					<div class="fastforward icon"></div>
				</div>
				<div class="right">
					<div class="liebiao icon"></div>
				</div>
			</div>
		</div>
	</div>
	<div class="ssBtn">
	        <div class="adf"></div>
    </div>
</div>
<ol id="playlist"></ol>
</div>

<script src="js/jquery.min.js"></script>
<script src="js/jquery.marquee.min.js"></script>

<script>
	var	playlist = [
		{title:"万象霜天",artist:"三无MarBlue",mp3:"music/万象霜天.mp3",cover:"music/万象霜天.png",}
	];
    var isRotate = true;
    var autoplay = true;
</script>
<script src="js/player.js"></script>
<script>
	function bgChange(){
		var lis= $('.lib');
		for(var i=0; i<lis.length; i+=2)
		lis[i].style.background = 'rgba(246, 246, 246, 0.5)';
	}
	window.onload = bgChange;
	setTimeout(()=>{
		$("#play-btn").click()
	},2000)
	setTimeout(()=>{
		$("#play-btn").click()
	},4000)

</script>

</body>
</html>

JQ实现音乐插件并自动播放

这里分享我最近写出来的一个小东西，基于jq的音乐播放器，可以嵌套到网站

效果截图：

具体首页代码如下：

整体下载：点击下载

下载后本地打开即可

如果对您有所帮助，欢迎您点个关注，我会定时更新技术文档，大家一起讨论学习，一起进步。