<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. 软工UML学习札记

    UML模型由:事物.关系和图组成 (1)类(class)── 类用带有类名.属性和操作的矩形框来表示. (2)主动类(active class)── 主动类的实例应具有一个或多个进程或线程,能够启动控 ...

  2. python BDD&TDD

    教程一:行为驱动开发(BDD) 基于Python的行为驱动开发实战: http://python.jobbole.com/81303/ 基于Python的行为驱动开发实战 英语原文地址: http:/ ...

  3. 414. Third Maximum Number

    这个题有点坑啊..主要是自己蠢,以为 Integer.MIN_VALUE -1 == -2147483649 public class Solution { public int thirdMax(i ...

  4. 在SQL中使用PL/SQL函数存在的问题

    -----------------------------Cryking原创------------------------------ -----------------------转载请注明出处, ...

  5. CentOS 6.4的安装--史上最全-CRPER木木

    安装工具及软件: VmwareWorkstation9 CentOS-6.4-x86_64-LiveCD Vmware初始设置:           刚装好的VMWARE启动后,虽说默认已经设置好基础 ...

  6. pat 1060. Are They Equal (25)

    题目意思直接,要求将两个数转为科学计数法表示,然后比较是否相同  不过有精度要求 /* test 6 3 0.00 00.00 test 3 3 0.1 0.001 0.001=0.1*10^-2 p ...

  7. [Angular 2] ng-model and ng-for with Select and Option elements

    You can use Select and Option elements in combination with ng-for and ng-model to create mini-forms ...

  8. PHP安全编程：跨站请求伪造CSRF的防御(转)

    跨站请求伪造(CSRF)是一种允许攻击者通过受害者发送任意HTTP请求的一类攻击方法.此处所指的受害者是一个不知情的同谋,所有的伪造请求都由他发起,而不是攻击者.这样,很你就很难确定哪些请求是属于跨站 ...

  9. Meth | phpstorm invalid descendent file name

     Failed to collect files: Invalid descendent file name "codelog_ddz.\"(]))\",\').txt& ...

  10. url编码解码-js编码、C#编码

    JS编码解码 函数一定义和用法encodeURI() 函数可把字符串作为 URI 进行编码. 语法 encodeURI(URIstring) 参数 描述 URIstring 必需.一个字符串,含有 U ...