0149.htm

最全的JS大全,希望大家喜欢.收录于网络.收录于网络.最全的JS大全,希望大家喜欢.

</script>
            </font>
            <div align=center id=a0><img height=16 src="img/circle1.gif" width=16></div>
            <div align=center id=a1><img height=16 src="img/circle2.gif" width=16></div>
            <div align=center id=a2><img height=16 src="img/circle1.gif" width=16></div>
            <div align=center id=a3><img height=16 src="img/circle2.gif" width=16></div>
            <div align=center id=a4><img height=16 src="img/circle1.gif" width=16></div>
            <div align=center id=a5><img height=16 src="img/circle2.gif" width=16></div>
            <div align=center id=a6><img height=16 src="img/circle1.gif" width=16></div>
            <div align=center id=a7><img height=16 src="img/circle2.gif" width=16></div>
            <div align=center id=a8><img height=16 src="img/circle1.gif" width=16></div>
            <div align=center id=a9><img height=16 src="img/circle2.gif" width=16></div>
            <div align=left id=what></div>
            <font color="#990000">提示</font>:一个做得十分好的鼠标跟随子，在立体与三维的空间表现方面做的很好，你将看到十个小球所产生的立体空间感觉.</td>
        </tr>
        <tr> 
          <td><img src="imgs/step.gif" width="30" height="30"> 将下面的代码复制到 &lt;body&gt; 
            内. 
            <input type="button" name="Button" value="复制到我的剪贴板" onClick=JM_cc('js_1')>
            <br>
            <form name="form1" method="post" action="">
              <textarea name="js_1" wrap="VIRTUAL" cols="80" rows="10">&lt;style type=text/css&gt;#a0 {
CLIP: rect(0px 16px 16px 0px); HEIGHT: 16px; LEFT: 24px; POSITION: absolute; TOP:
24px; WIDTH: 16px; Z-INDEX: 2000
}
#a1 {
CLIP: rect(0px 16px 16px 0px); HEIGHT: 16px; LEFT: 96px; POSITION: absolute; TOP:
24px; WIDTH: 16px; Z-INDEX: 2000
}
#a2 {
CLIP: rect(0px 16px 16px 0px); HEIGHT: 16px; LEFT: 132px; POSITION: absolute;
TOP: 24px; WIDTH: 16px; Z-INDEX: 2000
}
#a3 {
CLIP: rect(0px 16px 16px 0px); HEIGHT: 16px; LEFT: 192px; POSITION: absolute;
TOP: 24px; WIDTH: 16px; Z-INDEX: 2000
}
#a4 {
CLIP: rect(0px 16px 16px 0px); HEIGHT: 16px; LEFT: 240px; POSITION: absolute;
TOP: 24px; WIDTH: 16px; Z-INDEX: 2000
}
#a5 {
CLIP: rect(0px 16px 16px 0px); HEIGHT: 16px; LEFT: 280px; POSITION: absolute;
TOP: 24px; WIDTH: 16px; Z-INDEX: 2000
}
#a6 {
CLIP: rect(0px 16px 16px 0px); HEIGHT: 16px; LEFT: 24px; POSITION: absolute; TOP:
300px; WIDTH: 16px; Z-INDEX: 2000
}
#a7 {
CLIP: rect(0px 16px 16px 0px); HEIGHT: 16px; LEFT: 200px; POSITION: absolute;
TOP: 300px; WIDTH: 16px; Z-INDEX: 2000
}
#a8 {
CLIP: rect(0px 16px 16px 0px); HEIGHT: 16px; LEFT: 300px; POSITION: absolute;
TOP: 300px; WIDTH: 16px; Z-INDEX: 2000
}
#a9 {
CLIP: rect(0px 16px 16px 0px); HEIGHT: 16px; LEFT: 450px; POSITION: absolute;
TOP: 300px; WIDTH: 16px; Z-INDEX: 2000
}
#what {
LEFT: -96px; POSITION: absolute; TOP: 0px; VISIBILITY: hidden; Z-INDEX: 3000
}
&lt;/style&gt;
&lt;script language=JavaScript&gt;
  window.onerror=null;
  netscape = (document.layers) ? 1:0;
  goodIE = (document.all) ? 1:0;
  //window.onResize=&quot;history.go(0); setup()&quot;;
  document.onmousemove=MoveHandler;
  var gotthere = 0;
  var count = 0;
  toplocation = new Array( 0,30,57,80,101,125,80,80,101,125,80,0 );
  temptoplocation = new Array( 50,100,100,150,150,200,200,100,150,150,200,200,0
  );
  leftlocation = new Array( 0,292,318,181,181,217,263,318,181,181,217,263,-96
  );
  templeftlocation = new Array( 0,0,260,390,420,550,680,390,420,550,680,0 );
  difftop = new Array( 0,0,0,0,0,0,0,0,0,0,0,0 );
  diffleft = new Array( 0,0,0,0,0,0,0,0,0,0,0,0 );
  questtop = -13;
  questleft2 = -96;
  if (netscape) {
  window.captureEvents(Event.MOUSEMOVE);
  window.onMouseMove = MoveHandler; 
  var layerstart = &quot;document.&quot;;
  var layerleft = &quot;.left&quot;;
  var layertop = &quot;.top&quot;;
  var layerstyle = &quot;&quot;;
  var windowWidth = window.innerWidth;
  var windowHeight = window.innerHeight; }
  else if (goodIE) {
  layerstart = &quot;document.all.&quot;;
  layerleft = &quot;.left&quot;;
  layertop = &quot;.top&quot;;
  layerstyle = &quot;.style&quot;;
  windowWidth=600;
  windowHeight=400; }
  // end error trapping
  var Ypos2 = 72;
  var Xpos2 = 72;
  function MoveHandler(e) {
  if (netscape || goodIE) {
  Xpos2 = (netscape)?e.pageX:event.x
  Ypos2 = (netscape)?e.pageY:event.y
  Xorigin = Xpos2;
  Yorigin = Ypos2; 
  if (Ypos2 &gt; windowHeight/2) {
  if (Xpos2 &gt; windowWidth/2) { direction = 1;} 
  else { direction = -1;} }
  else {
  if (Xpos2 &gt; windowWidth/2) { direction = -1;} 
  else { direction = 1;} }
  }}
  amountup=44;
  function startthedots() {
  if (goodIE) {
  windowWidth=document.body.clientWidth;
  windowHeight=document.body.clientHeight; }
  markMe();
  eval(layerstart+&quot;what&quot;+layerstyle+layertop+&quot; = windowHeight-amountup&quot;);
  eval(layerstart+&quot;what&quot;+layerstyle+&quot;.visibility = 'visible'&quot;);
  Xorigin = 204;
  Yorigin = 147; 
  spin();run(); }
  var OrbitSize = 250;
  count=1; delay=100; direction = -1;
  var speed = 0.0628;
  var offset = 1;
  Count = new Array ( 0, .63, 1.26, 1.89, 2.52, 3.15, 3.78, 4.41, 5.04, 5.67 );
  PreCount = new Array ( 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 );
  Xcount = new Array()
  Ycount = new Array()
  for ( j = 0 ; j &lt;= 300 ; j++ ) {
  Xcount[j] = Math.sin(j*speed); 
  Ycount[j] = Math.cos(j*speed);
  }
  placeholder = 100;
  Xpoint = new Array ( 0, .63, 1.26, 1.89, 2.52, 3.15, 3.78, 4.41, 5.04, 5.67
  );
  Ypoint = new Array ( 0, .63, 1.26, 1.89, 2.52, 3.15, 3.78, 4.41, 5.04, 5.67
  );
  function spin() {
  if (direction) {
  placeholder++; 
  if (placeholder &gt; 199) { placeholder=100; }}
  else {
  placeholder--; 
  if (placeholder &lt; 100 ) { placeholder=199; }}
  for ( j = 0 ; j &lt;= 9 ; j++ ) {
  Xpoint[j] = Xorigin + ( (OrbitSize*offset) * Xcount[placeholder+(j*10*direction)]
  ); 
  Ypoint[j] = Yorigin + ((OrbitSize * Ycount[placeholder+(j*10*direction)]) +
  dotsoff);
  }
  setTimeout('spin()',20); 
  //window.status='Xorigin = '+Xorigin+' / Yorigin = '+Yorigin;
  }
  function run() {
  count++; 
  for ( j = 0 ; j &lt;= 9 ; j++ ) {
  difftop[j] = Ypoint[j] - temptoplocation[j];
  diffleft[j] = Xpoint[j] - templeftlocation[j];
  diff = 30;
  temptoplocation[j] = temptoplocation[j] + (difftop[j]/diff);
  templeftlocation[j] = templeftlocation[j] + diffleft[j]/diff;
  eval(layerstart+&quot;a&quot;+j+layerstyle+layerleft+&quot; = templeftlocation[&quot;+j+&quot;]&quot;);
  eval(layerstart+&quot;a&quot;+j+layerstyle+layertop+&quot; = temptoplocation[&quot;+j+&quot;]&quot;);
  }
  setTimeout('run()', 47) }
  goforit=1;
  function question0() {
  if (goforit) { goforit=0; question1(); }}
  function question1() {
  questleft2++;questleft2++;questleft2++;
  if (questleft2 &lt;= 0) { 
  eval(layerstart+&quot;what&quot;+layerstyle+layerleft+&quot; = questleft2&quot;);
  
  setTimeout('question1()', 10); }
  else { setTimeout('question2()',1000);}
  }
  function question2() {
  questleft2--;questleft2--;questleft2--;
  if (questleft2 &gt;= -96) { 
  eval(layerstart+&quot;what&quot;+layerstyle+layerleft+&quot; = questleft2&quot;);
  
  setTimeout('question2()', 10); }
  if (questleft2 == -96) { goforit=1; } }
  mark = 150; // milliseconds
  navDOM = window.innerHeight; // Nav DOM flag
  function markMe() {
  window.onresize=setup;
  markID = setInterval (&quot;setup()&quot;,mark);
  }
  var dotsoff=0;
  function setup() {
  pagescroll=navDOM?pageYOffset:document.body.scrollTop
  eval(layerstart+&quot;what&quot;+layerstyle+layertop+&quot; = windowHeight-amountup+pagescroll&quot;);
  if (!netscape) { dotsoff = pagescroll; }
  }
  //-- end script --&gt;
  &lt;/script&gt;
  &lt;/font&gt;
  &lt;div align=center id=a0&gt;&lt;img height=16 src=&quot;exp_imgs/circle1.gif&quot;
  width=16&gt;&lt;/div&gt;
  &lt;div align=center id=a1&gt;&lt;img height=16 src=&quot;exp_imgs/circle2.gif&quot;
  width=16&gt;&lt;/div&gt;
  &lt;div align=center id=a2&gt;&lt;img height=16 src=&quot;exp_imgs/circle1.gif&quot;
  width=16&gt;&lt;/div&gt;
  &lt;div align=center id=a3&gt;&lt;img height=16 src=&quot;exp_imgs/circle2.gif&quot;
  width=16&gt;&lt;/div&gt;
  &lt;div align=center id=a4&gt;&lt;img height=16 src=&quot;exp_imgs/circle1.gif&quot;
  width=16&gt;&lt;/div&gt;
  &lt;div align=center id=a5&gt;&lt;img height=16 src=&quot;exp_imgs/circle2.gif&quot;
  width=16&gt;&lt;/div&gt;
  &lt;div align=center id=a6&gt;&lt;img height=16 src=&quot;exp_imgs/circle1.gif&quot;
  width=16&gt;&lt;/div&gt;
  &lt;div align=center id=a7&gt;&lt;img height=16 src=&quot;exp_imgs/circle2.gif&quot;
  width=16&gt;&lt;/div&gt;
  &lt;div align=center id=a8&gt;&lt;img height=16 src=&quot;exp_imgs/circle1.gif&quot;
  width=16&gt;&lt;/div&gt;
  &lt;div align=center id=a9&gt;&lt;img height=16 src=&quot;exp_imgs/circle2.gif&quot;
  width=16&gt;&lt;/div&gt;
  &lt;div align=left id=what&gt;&lt;/div&gt;</textarea>
            </form>
            <br>
            <img src="imgs/step2.gif" width="30" height="30"> 在&lt;body&gt;标签中加入 
            <font color="#990000">onload=startthedots() </font>来触发这个动画<br>
            <br>
            <img src="imgs/step3.gif" width="30" height="30"> <img src="img/circle1.gif" width="16" height="16"><img src="img/circle2.gif" width="16" height="16"> 
            两个使用到的图片，当你在Dreamweaver中粘贴第一步的代码后，你会看见有十张图片的有错误，重新选择一次就可以了.<br>
          </td>
        </tr>
      </table>
    </TD>
    <TD><IMG src="../../images/space.gif"    width=11 height="1"></TD>
  </TR>
</TABLE>
<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
  <TR bgColor=#ffffff> 
    <TD><IMG src="../images/sq_3.gif" width=11 height="14"></TD>
    <TD width="100%"></TD>
    <TD><IMG src="../images/sq_4.gif"    width=11 height="14"></TD>
  </TR>
</TABLE>
</BODY>
</HTML>