JavaScript 鼠标划过 播放音乐。

'<EMBED style="FILTER: xray()" src="mp3/'+s+'" width=360 height=30 type=audio/mpeg volume="0" loop="-1">'
//EMBED : 镶入式 | FILTER: 滤波器 | volume:音量 | loop :循环
  1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2 <html xmlns="http://www.w3.org/1999/xhtml">
  3 <head>
  4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5 <title>音乐之家</title>
  6 <style type="text/css">
  7 <!--
  8 #box {
  9     height: 650px;
 10     width: 600px;
 11     margin-top: 10px;
 12     margin-right: auto;
 13     margin-left: auto;
 14 }
 15 .mi {
 16     margin: 5px;
 17     float: left;
 18     height: 110px;
 19     width: 110px;
 20 }
 21 a {
 22     height: 110px;
 23     width: 100%;
 24     display: block;
 25 }
 26 body {
 27     background-image: url(bg1.jpg);
 28     background-attachment: scroll;
 29     background-repeat: no-repeat;
 30     background-position: center top;
 31 }
 32 #m1 {
 33     background-image: url(mi/1.jpg);
 34 }
 35 #m2 {
 36     background-image: url(mi/2.jpg);
 37 }
 38 #m3 {
 39     background-image: url(mi/3.jpg);
 40 }
 41 #m4 {
 42     background-image: url(mi/4.jpg);
 43 }
 44 #m5 {
 45     background-image: url(mi/5.jpg);
 46 }
 47 #m6 {
 48     background-image: url(mi/6.jpg);
 49 }
 50 #m7 {
 51     background-image: url(mi/7.jpg);
 52 }
 53 #m8 {
 54     background-image: url(mi/8.jpg);
 55 }
 56 #m9 {
 57     background-image: url(mi/9.jpg);
 58 }
 59 #m10 {
 60     background-image: url(mi/10.jpg);
 61 }
 62 #m11 {
 63     background-image: url(mi/11.jpg);
 64 }
 65 #m12 {
 66     background-image: url(mi/12.jpg);
 67 }
 68 #m13 {
 69     background-image: url(mi/13.jpg);
 70 }
 71 #m14 {
 72     background-image: url(mi/14.jpg);
 73 }
 74 #m15 {
 75     background-image: url(mi/15.jpg);
 76 }
 77 #m16 {
 78     background-image: url(mi/16.jpg);
 79 }
 80 #m17 {
 81     background-image: url(mi/17.jpg);
 82 }
 83 #m18 {
 84     background-image: url(mi/18.jpg);
 85 }
 86 #m19 {
 87     background-image: url(mi/19.jpg);
 88 }
 89 #m20 {
 90     background-image: url(mi/20.jpg);
 91 }
 92 -->
 93 </style>
 94 </head>
 95 <script src="jquery.rotate.min.js"></script>
 96 <script language="javascript">
 97         function play(s){
 98                     
 99                 var m = '<EMBED style="FILTER: xray()" src="mp3/'+s+'" width=360 height=30 type=audio/mpeg volume="0" loop="-1">'
100                 $("#msg").html(m)
101         }
102         function stop1(){
103         
104                 $("#msg").html("")
105         }
106 
107 </script>
108 <body>
109 <div id="box">
110     <div id="m1" class="mi"><a href="#" onclick="" onmouseover="play('a1.mp3')" onmouseout="stop1()" ></a></div>
111     <div id="m2" class="mi"><a href="#" onclick="" onmouseover="play('a2.mp3')" onmouseout="stop1()" ></a></div>
112     <div id="m3" class="mi"><a href="#" onclick="" onmouseover="play('a3.mp3')" onmouseout="stop1()" ></a></div>
113     <div id="m4" class="mi"><a href="#" onclick="" onmouseover="play('a4.mp3')" onmouseout="stop1()" ></a></div>
114     <div id="m5" class="mi"><a href="#" onclick="" onmouseover="play('a5.mp3')" onmouseout="stop1()" ></a></div>
115     <div id="m6" class="mi"><a href="#" onclick="" onmouseover="play('a6.mp3')" onmouseout="stop1()" ></a></div>
116     <div id="m7" class="mi"><a href="#" onclick="" onmouseover="play('a7.mp3')" onmouseout="stop1()" ></a></div>
117     <div id="m8" class="mi"><a href="#" onclick="" onmouseover="play('a8.mp3')" onmouseout="stop1()" ></a></div>
118     <div id="m9" class="mi"><a href="#" onclick="" onmouseover="play('a9.mp3')" onmouseout="stop1()" ></a></div>
119     <div id="m10" class="mi"><a href="#" onclick="" onmouseover="play('a10.mp3')" onmouseout="stop1()" ></a></div>
120        <div id="m11" class="mi"><a href="#" onclick="" onmouseover="play('a11.mp3')" onmouseout="stop1()" ></a></div>
121     <div id="m12" class="mi"><a href="#" onclick="" onmouseover="play('a12mp3')" onmouseout="stop1()" ></a></div>
122     <div id="m13" class="mi"><a href="#" onclick="" onmouseover="play('a13.mp3')" onmouseout="stop1()" ></a></div>
123     <div id="m14" class="mi"><a href="#" onclick="" onmouseover="play('a14.mp3')" onmouseout="stop1()" ></a></div>
124     <div id="m15" class="mi"><a href="#" onclick="" onmouseover="play('a15.mp3')" onmouseout="stop1()" ></a></div>
125     <div id="m16" class="mi"><a href="#" onclick="" onmouseover="play('a16.mp3')" onmouseout="stop1()" ></a></div>
126     <div id="m17" class="mi"><a href="#" onclick="" onmouseover="play('a17.mp3')" onmouseout="stop1()" ></a></div>
127     <div id="m18" class="mi"><a href="#" onclick="" onmouseover="play('a18.mp3')" onmouseout="stop1()" ></a></div>
128     <div id="m19" class="mi"><a href="#" onclick="" onmouseover="play('a19.mp3')" onmouseout="stop1()" ></a></div>
129     <div id="m20" class="mi"><a href="#" onclick="" onmouseover="play('a20.mp3')" onmouseout="stop1()" ></a></div>
130 </div>
131 <div id="msg"></div>
132 
133 </body>
134 </html>

 

原文地址:https://www.cnblogs.com/wintuzi/p/4829028.html