黑马程序员技术交流社区

标题: 关于页面的某个区域随着光标移动中的一个问题？ [打印本页]
作者: 马东华    时间: 2012-6-8 14:43
标题: 关于页面的某个区域随着光标移动中的一个问题？
下面的是我的程序；
  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.                 #bodyid{
  8.                         border:#000 1px solid;
  9.                         width:300px;
  10.                         height:600px;
  11.                 }
  12.         </style>
  13.     <script type="text/javascript">
  14.                 window.onload=function()
  15.                 {
  16.                         document.body.onmousemove=function()
  17.                         {
  18.                                 var adNode=document.getElementById("ad");
  19.                                 adNode.style.left=event.x;
  20.                                 adNode.style.top=event.y;
  21.                         }
  22.                 }
  23.         </script>
  24. </head>

  26. <body>
  27.         <div id="ad" style="position:absolute; left:0; top:0">
  28.             <img src="1.jpg" height="80px" width="100px" />
  29.     </div>
  30.     <div id="bodyid">
  31.     body区域
  32.     </div>
  33. </body>
  34. </html>
复制代码
为什么我的结果不是随着光标的移动而用呢？求各位大侠给个帮助？
作者: 唐志兵    时间: 2012-6-8 14:55
  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.                 #bodyid{
  8.                         border:#000 1px solid;
  9.                         width:300px;
  10.                         height:600px;
  11.                 }
  12. </style>

  14. <script type="text/javascript">
  15.                 window.onload=function()
  16.                 {
  17.                         document.body.onmousemove=function()
  18.                         {
  19.                                 var adNode=document.getElementById("ad");
  20.                                 adNode.style.left=event.x-30;   //这里可以适当减去30个像素,这样鼠标的位置就不会处于div的边缘了。
  21.                                 adNode.style.top=event.y-30;  //同理
  22.                         }
  23.                 }
  24. </script>
  25. </head>

  27. <body>
  28.         <div id="ad" style="position:absolute; left:0; top:0">
  29.             <img src="1.jpg" height="80px" width="100px" />
  30.     </div>
  31.     <div id="bodyid">
  32.     body区域
  33.     </div>
  34. </body>
  35. </html>
复制代码
貌似我之前看到也是你的问题，给你的建议：换ie浏览器，不要用别的浏览器。你的代码没有错。



欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2