<!--音乐-->

		<div id="music">

			<img src="../img/music.gif" class="m" />

			<img src="../img/music_off.png" class="off" />

			<!--<audio src="../mp3/bgmusic.mp3" loop="loop" preload="auto" autoplay="autoplay" class="bgmusic">你的浏览器不支持audio标签。</audio>-->

		</div>

		<!--end-->

#music {

	width: 0.8rem;

	height: 0.8rem;

	position: fixed;

	top: 0.2rem;

	right: 0.3rem;

	z-index: 9999;

	background-size: contain;

	text-align: center;

}

@keyframes music {

	from {

		transform: rotate(0deg);

	}

	to {

		transform: rotate(360deg);

	}

}

#music img.m{

	width: 100%;

	height: 100%;

}

#music img.off {

	position: absolute;

	top: 25%;

	left: 25%;

	transform: translateX(-50%);

	animation: music 2s linear infinite;

}

<script type="text/javascript">

			$(function(){

				var play=true;

				$("#music").click(function(e){

					if(play==true){

						$(".m").hide();

						$(".off").css({

							"transform":"rotate(0deg)",

							"animation":"music 0s"

						})

						$(".bgmusic").get(0).pause();

						play=false;

					}else{

						$(".m").show();

						$(".off").css({

							"animation":"music 2s linear infinite"

						})

						$(".bgmusic").get(0).play()

						play=true;

					}

				})

			})

		</script>