<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>javascript获得鼠标位置</title>

</head>

<body>

<div id="lijj"  style="width:500px;height:500px;background:#000;">

</div>

<script>

function mouseMove(ev)

{

    Ev= ev || window.event;

    var mousePos = mouseCoords(ev);

    document.getElementById("xxx").value = mousePos.x;

    document.getElementById("yyy").value = mousePos.y;

}

function mouseCoords(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

    };

}

document.getElementById('lijj').onclick = mouseMove; 

</script>

鼠标X轴:

<input id=xxx type=text>

鼠标Y轴:

<input id=yyy type=text>

</body>

js 获取鼠标位置坐标的更多相关文章

  1. 原生js获取鼠标坐标方法全面讲解-zmq

    原生js获取鼠标坐标方法全面讲解:clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y 一.关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种:eve ...

  2. js获取鼠标位置的各种方法

    在一些DOM操作中我们经常会跟元素的位置打交道,鼠标交互式一个经常用到的方面,令人失望的是不同的浏览器下会有不同的结果甚至是有的浏览器下没结果,这篇文章就上鼠标点击位置坐标获取做一些简单的总结,没特殊 ...

  3. js获取鼠标坐标位置兼容多个浏览器

    这个是IE 11 下兼容下视图测试时可用. $(window).bind('beforeunload', function (event) { var _this = this; var x = ev ...

  4. JS获取鼠标位置，兼容IE FF

    由于Firefox和IE等浏览器之间对js解释的方式不一样,firefox下面获取鼠标位置不能够直接使用clientX来获取.网上说的一般都是触发mousemove事件才行.我这里有两段代码,思路都一 ...

  5. js 获取鼠标的手势方向角度

    需要获取鼠标的移动角度 1.mousedown 确定起始点 2.mousemove 确立相关点 3.先计算两点的斜率,然后根据三角函数和反三角函数.转换为角度 <!DOCTYPE html> ...

  6. JS获取鼠标左（右）滑事件

    鼠标左(右)滑也是网站开发中常见的效果之一,这里对鼠标左(右)滑做出一些解释. 首先要获取需要左右滑事件的节点: eg: var div=document.getElementById("d ...

  7. js获取鼠标的位置

    <!doctype html><html><head><meta charset="utf-8"><title>获取鼠标 ...

  8. JS 获取鼠标坐标

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. js获取鼠标当前的位置

    有时候,我们需要得到窗口拖动或者鼠标移动的距离,此时可以通过计算鼠标前后在页面中的位置来得到想要的结果,下面介绍几个事件属性: 1.客户区坐标位置 鼠标事件都是在浏览器视口中的特定位置上发生的.这个位 ...

随机推荐

  1. 杂题 SPOJ MOBILE2 - Mobiles

    MOBILE2 - Mobiles no tags  You have been asked to buy a gift for your baby brother, Ike. However, yo ...

  2. vector::erase returns incompatible iterator in debug build

    关于std::vector中erase的用法http://www.cplusplus.com/reference/vector/vector/erase/ #include <vector> ...

  3. HDOJ(HDU) 2186 悼念512汶川大地震遇难同胞——一定要记住我爱你

    Problem Description 当抢救人员发现她的时候,她已经死了,是被垮塌下来的房子压死的,透过那一堆废墟的的间隙可以看到她死亡的姿势,双膝跪着,整个上身向前匍匐着,双手扶着地支撑着身体,有 ...

  4. HDU 2222 AC自动机 裸题

    题意: 问母串中出现多少个模式串 注意ac自动机的节点总数 #include <stdio.h> #include <string.h> #include <queue& ...

  5. angularJS constant和value

    angularJS可以通过constant(name,value)和value(name,value)对于创建服务也是很重要的. 相同点是:都可以接受两个参数,name和value. 区别: 1.co ...

  6. LINUX curl GET 掉参数解决办法

    LINUX curl GET 掉参数解决方法 url 为 http://mywebsite.com/index.php?a=1&b=2&c=3web形式下访问url地址,使用 $_GE ...

  7. DBCP,C3P0,Tomcat_JDBC 性能及稳定性测试

    1.测试环境: 硬件环境: 数据库服务器:2U*8核 8G内存 测试服务器:   2U*8核 6G内存 软件环境: jdk: 1.6.29 mysql: 5.0.77 mysql_driver: my ...

  8. .NET常用的扩展方法整理

    using System; using System.Collections; using System.Collections.Generic; using System.Data; using S ...

  9. TeleMCU视频会议之Android版本号WebRTC client支持

    本文原创自 http://blog.csdn.net/voipmaker  转载注明出处. 最新版本号TeleMCU 添加了Android手机端WebRTC视频会议能力,Android手机安装Chro ...

  10. select默认选择的实现方法

    <script type="text/javascript"> <!-- document.biao.bbb.value = "云南";//b ...