⭐ 欢迎来到虫虫下载站! | 📦 资源下载 📁 资源专辑 ℹ️ 关于我们
⭐ 虫虫下载站

📄 图片跟随鼠标.htm

📁 javascript 核心技术 eval()函数的使用 DOM2 事件模型 非标准事件绑定 图片跟随鼠标 传统文档对象测试
💻 HTM
字号:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>图片跟随鼠标</title>
    <script type="text/javascript" language="javascript">
    <!--
       var newtop=0;
       var newleft=0;
       if(navigator.appName=="NetScape")
       {
         layerStyleRef="layer.";
         layerRef="document.layers";
         styleSwitch="";
       }else
       {
         layerStyleRef="layer.style";
         layerRef="document.all";
         styleSwitch=".style";
       }
       function dooMouseMove()
       {
          layerName='iit';
          eval('var curElement='+layerRef+'["'+layerName+'"]');
          eval(layerRef+'["'+layerName+'"]'+styleSwitch+'.visibility="hidden"');
          eval('curElement'+styleSwitch+'.visibility="visible"');
          eval('newleft=document.body.clientWidth-curElement'+styleSwitch+'.pixelWidth');
          eval('newtop=document.body.clientHeight-curElement'+styleSwitch+'.pixelHeight');
          eval('height=curElement'+styleSwitch+'.height');
          eval('width=curElement'+styleSwitch+'.width');
          width=parseInt(width);
          height=parseInt(height);
          
          if(event.clientX>(document.body.clientWidth-5-width))
          {
            newleft=document.body.clientWidth+document.body.scrollLeft-5-width;
            
          }
          else
          {
            newleft=document.body.scrollLeft+event.clientX;
          }
          eval('curElement'+styleSwitch+'.pixelLeft=newleft');
          if(event.clientY>(document.body.clientHeight-5-height))
          {
            newtop=document.body.clientHeight+document.body.scrollTop-5-height;
            
          }
          else
          {
            newtop=document.body.scrollTop+event.clientY;
          }
          eval('curElement'+styleSwitch+'.pixelTop=newtop');
       }
   document.onmousemove=dooMouseMove;
    //-->
    </script>
</head>
<body   >

<center ><h1>图片跟随鼠标示例</h1><br /><br /></center>
<hr />
<script type="text/javascript" language="javascript" >
<!--
   if(navigator.appName=="NetScape")
   {}
   else
   {
     document.write('<div ID=OuterDiv>');
     document.write('<img ID=iit src="addi.jpg" style="position:absolute;TOP:5pt;LEFT:5pt;Z-INDEX:10;visibility:hidden;">');
     document.write('</div>');
   }
//-->
</script>

</body>
</html>

⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -