zoukankan      html  css  js  c++  java
  • javascript获得鼠标的坐标值

    一、需求:

    1、当需求为获得的坐标值相对于body时实现方法

    2、当需求为获得的坐标值相对于某一对象时实现方法

    二、实现:

    var x , y;
    
    //当需求为获得的坐标值相对于body时,用: 
    function positionBody(event){
    
        event = event||window.event; 
        //获得相对于body定位的横标值;
    
        x=event.clientX 
        //获得相对于body定位的纵标值; 
        y=event.clientY 
    }
    
     
    
    //当需求为获得的坐标值相对于某一对象时,用: 
    function positionObj(event,id){
    
        //获得对象相对于页面的横坐标值;id为对象的id 
        var thisX = document.getElementById(id).offsetLeft;
    
        //获得对象相对于页面的横坐标值; 
        var thisY = document.getElementById(id).offsetTop;
    
        //获得页面滚动的距离; 
        //注:document.documentElement.scrollTop为支持非谷歌内核;document.body.scrollTop为谷歌内核 
        var thisScrollTop = document.documentElement.scrollTop + document.body.scrollTop;
    
        event = event||window.event; 
        //获得相对于对象定位的横标值 = 鼠标当前相对页面的横坐标值 - 对象横坐标值;
    
        x = event.clientX - thisX;
    
        //获得相对于对象定位的纵标值 = 鼠标当前相对页面的纵坐标值 - 对象纵坐标值 + 滚动条滚动的高度; 
        y = event.clientY - thisY + thisScrollTop; 
    
    }

    三、实例下载:

           点击这里

    四、如果有更好的方法,可以的话 ,相互交流下,共同进步!

  • 相关阅读:
    神奇的C语言
    实现代码编辑器
    实现了一个简单的key-value存储系统
    一些官网说明
    苹果用户转入mate30,被恶心到了
    吐嘈一下乱用注入
    谈一下OOP的乱用现象
    mongo3.x ssl版安装文件
    再谈LRU双链表内存管理
    cocos在win平台exe无法使用 UserDefault 解决方法
  • 原文地址:https://www.cnblogs.com/waitingbar/p/2710443.html
Copyright © 2011-2022 走看看