zoukankan      html  css  js  c++  java
  • 获取鼠标经过位置的X、Y坐标

    利用JavaScript获取鼠标经过位置的X、Y坐标方法。

    <!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 charset="UTF-8">
    <title>XYPosition</title>

    <script language="javascript">
    function mousePosition(ev){
       if(ev.pageX || ev.pageY){
        return {x:ev.pageX, y:ev.pageY};
       }
      return {
        x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
        y:ev.clientY + document.body.scrollTop - document.body.clientTop
      };
    }

    function mouseMove(ev){
      ev = ev || window.event;
      var mousePos = mousePosition(ev);
      document.getElementById('xzb').value = mousePos.x;
      document.getElementById('yzb').value = mousePos.y;
    }

    document.onmousemove = mouseMove;

    /*
    function Show(el){
    //alert(el.offsetLeft);
    //alert(el.offsetLeft);
    var x = parseInt(document.getElementById('xzb').value)-el.offsetLeft;
    var y = parseInt(document.getElementById('yzb').value)-el.offsetTop;
    if (x>660 && x <760){
    if(y>140 && y <360){
    //alert(x+","+y);
    window.location.href = "index.htm";
    }
    }
    x = "X:"+x;
    y = "Y:"+y;
    //alert(x+","+y);
    }
    */
    </script>

    </head>
    <body>
    X:<input id="xzb" type="text" /> Y:<input id="yzb" type="text" /></br>
    <img id="imgPic" src="img/css_globe_diffuse2.jpg" onclick="Show(this)" />

    </body>
    </html>

  • 相关阅读:
    Dictionaries and lists
    Looping and dictionaries
    Dictionary as a set of counters
    Dictionaries
    List exercise
    Lists and strings
    Copying lists
    Objects and values
    [luoguP1944] 最长括号匹配_NOI导刊2009提高(1)
    [luoguP1868] 饥饿的奶牛(DP)
  • 原文地址:https://www.cnblogs.com/monjeo/p/7754341.html
Copyright © 2011-2022 走看看