<!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>
    
</head>
<body>
<script type="text/javascript">
    document.onmousemove = function () {
        var fly = document.getElementById("fly");
        var x = window.event.clientX;
        var y = window.event.clientY;
        if (!fly) {
            return;
        }
        fly.style.left = x;
        fly.style.top = y;
    };
    </script><div id="fly" style="position:absolute">
    <img src="sun_wk.gif" /><br /></div></body>
</html>上面的代码为什么不行。要实现的效果是,图片跟着鼠标移动
但去掉<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">就好了,为什么????

解决方案 »

  1.   

    试了下,IE8下不去掉这一段也实现了图片跟着鼠标移动的效果。
    不知楼主用的IE几?
      

  2.   

    <script type="text/javascript">
    function a(e){
    var a=e||window.event;
    var img=document.getElementById("test");
    img.style.left=a.clientX+"px";
    img.style.top=a.clientY+"px";
    }
    document.onmousemove=a;
    </script>
    <body>
    <div id="test" style="position:absolute">
    <img src="1.jpg" />
    </div>
    楼主大概用的不是ie吧?
      

  3.   


    <!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">
        document.onmousemove = function (e) {
    e = window.event || e;
            var fly = document.getElementById("fly");
            var x = e.clientX;
            var y = e.clientY;
            if (!fly) {
                return;
            }
            fly.style.left = x + 'px';
            fly.style.top = y + 'px';
        };
        </script>  
    </head>
    <body>
    <div id="fly" style="position:absolute">
        <img src="http://avatar.profile.csdn.net/A/E/C/2_chang890112.jpg" /><br /></div></body>
    </html>
    试试