div跟随鼠标移动代码。不需要jquery,div自动调整div到页面的右边后到左边来,鼠标到下面时到div到上面,支持滚动条移动哪位大虾有这样的代码。我找了好久没找到。包括找了国外的网站

解决方案 »

  1.   

    判断鼠标的位置,判断层与body的位置UP
      

  2.   

    div到页面的右边后到左边来,鼠标到下面时到div到上面,支持滚动条移动 
    看了好几遍也没看懂这 句
      

  3.   

    根据offsetWidth还有鼠标的坐标计算下就成了,自己判断下就成了,有你找的这时间,估计你都写成了
      

  4.   

    <!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>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    </head><body>
    <div style="background-color:#00CC00; width:100px; height:100px; position:absolute; left:225px; top:80px;" id="div1"></div>
    </body>
    </html>
    <script>
    var m_x;
    var m_y;
    var div_=document.getElementById("div1").style;
    var id1;
    var id2;
    document.onmousemove=function()
    {
    m_x=event.x;
    m_y=event.y;
    move();
    }

    function move()
    {
    if(parseInt(div_.left)>parseInt(m_x))
    {
    if(id1==null)
    id1=setInterval(div_move_left,10);
    }
    else
    {
    if(id1==null)
    id1=setInterval(div_move_right,10);
    }
    if(parseInt(div_.top)>parseInt(m_y))
    {
    if(id2==null)
    id2=setInterval(div_move_top,10);
    }
    else
    {
    if(id2==null)
    id2=setInterval(div_move_bottom,10);
    }
    }
    function div_move_left()
    {
    div_.left=parseInt(div_.left)-2;
    if(parseInt(div_.left)<parseInt(m_x))
    {
    clearInterval(id1);
    id1=null;
    }
    }
    function div_move_right()
    {
    div_.left=parseInt(div_.left)+2;
    if(parseInt(div_.left)>parseInt(m_x))
    {
    clearInterval(id1);
    id1=null;
    }
    }
    function div_move_top()
    {
    div_.top=parseInt(div_.top)-2;
    if(parseInt(div_.top)<parseInt(m_y))
    {
    clearInterval(id2);
    id2=null;
    }
    }
    function div_move_bottom()
    {
    div_.top=parseInt(div_.top)+2;
    if(parseInt(div_.top)>parseInt(m_y))
    {
    clearInterval(id2);
    id2=null;
    }
    }
    </script>
      

  5.   

    虽然没找到答案,但是多少给点分数。hhh816大哥贴了很多代码。呵呵