js原生代码编写一个鼠标在页面移动坐标的检测功能,兼容各大浏览器

function mousePosition(e) {
    //IE9以上的浏览器获取  
    if (e.pageX || e.pageY) {  
        return {
            x: e.pageX,
            y: e.pageY
        };  
    }  
    //IE9以下
    //IE中document文档实际并不在(0,0)的位置,在它周围有一个小(通常有2px)边框,document.body.clientLeft和document.body.clientTop包含了这个边框的宽度  
    return {
        x: e.clientX + document.body.scrollLeft- document.body.clientLeft,
        y: e.clientY + document.body.scrollTop-document.body.clientTop  
    };  
   } 

  

时间: 2025-01-05 01:12:10

js原生代码编写一个鼠标在页面移动坐标的检测功能,兼容各大浏览器的相关文章

仿jQuery的siblings效果的js原生代码

仿jQuery的siblings效果的js原生代码 <previousSibling> 属性返回选定节点的上一个同级节点(在相同树层级中的前一个节点). <nextSibling> 属性返回被选节点的下一个同级节点(在相同树层级中的下一个节点). 如果不存在这样的节点,则该属性返回 null.//元素节点的节点类型是 1  obj.previousSibling.nodeType ==1; reverse() 方法用于颠倒数组中元素的顺序. push() 方法可向数组的末尾添加一个

js界面刷新&Django使用Ajax实现页面无刷新评论回复功能

Django使用Ajax实现页面无刷新评论回复功能 http://www.cnblogs.com/mfc-itblog/p/5188900.html js界面刷新 http://www.cnblogs.com/dingdingo/archive/2011/10/26/2225307.html js界面刷新&Django使用Ajax实现页面无刷新评论回复功能

【js】js访问剪切板(兼容各大浏览器)唯一解决方案ZeroClipboard.swf

需求描述: 通过JS实现将页面中的某个元素的数据复制到剪切板上. 需求分析: 要用JS实现最大的问题就是浏览器的兼容性问题了.而且最大的问题还是浏览器出于安全型的考虑,所以像chrome,Firefox等浏览器都不让访问. 解决方案: 最终的解决方案还是通过flash实现的,在网上搜索(关键字:js access clipboard)了一大堆的相关资料,但是这或许是唯一的解决方案了吧!真没想到,flash还是最终的解决方法.当有一天flash彻底被浏览器给抛弃了我想这又将是一大问题了.但是这个问

JS原生代码实现导航高亮

一 实现原理 根据当前页面滚动条的高度判断当前页面应当与导航栏中哪个导航相关联,并对相应的导航设置高亮样式. 二 代码解析 先简单写一个页面顶端的导航栏:<nav>  <ul>    <li><a class="nav active" href="#nav1">导航1</a></li>    <li><a class="nav" href="#na

利用JS跨域做一个简单的页面访问统计系统

其实在大部分互联网web产品中,我们通常会用百度统计或者谷歌统计分析系统,通过在程序中引入特定的JS脚本,然后便可以在这些统计系统中看到自己网站页面具体的访问情况.但是有些时候,由于一些特殊情况,我们需要自己来设计统计系统.由于前段时间公司的业务需求,我也是自己尝试了下,本文提供的是一个基本思路,统计系统也比较简单. 几个基本统计需求: 1.统计web每个页面用户访问量 2.统计用户访问者的和IP地址信息 3.页面之间的跳转情况 4.访问高峰时间段 服务器结构: 数据库表设计: 以上只是我简单列

利用JS跨域做一个简单的页面訪问统计系统

事实上在大部分互联网web产品中,我们一般会用百度统计或者谷歌统计分析系统,通过在程序中引入特定的JS脚本,然后便能够在这些统计系统中看到自己站点页面详细的訪问情况.可是有些时候,因为一些特殊情况,我们须要自己来设计统计系统.因为前段时间公司的业务需求,我也是自己尝试了下,本文提供的是一个基本思路,统计系统也比較简单. 几个基本统计需求: 1.统计web每一个页面用户訪问量 2.统计用户訪问者的和IP地址信息 3.页面之间的跳转情况 4.訪问高峰时间段 server结构: 数据库表设计: 以上仅

在学js原生遇到了一个问题,解决了希望对大家有帮助

今天在学原生时遇到一个不算问题的问题,怎么叫不算问题的问题呢?  下面就是问题 window.onload=function () { var oDiv=document.getElementById('drop');//获取到整个盒子 var oH2=oDiv.getElementsByTagName('h2')[0];//获取到播放列表 var oUl=oDiv.getElementsByTagName('ul')[0];//获取到播放列表曲目 oH2.onclick=showHideUl;

JS原生代码之倒计时抢购

刚刚用了一点时间把完善了的倒计时抢购功能又做了一遍,这回用的是原声代码,没有引入jquery库,虽然明显感觉原生代码量要多一些,但是写出来个小功能还是很有成就感的.需要注意的就是代码顺序执行的问题,一定要思路清晰.要不然代码顺序写错,有些功能还是实现不了的. 学到了原声js改变input的disabled的属性值,因为想让倒计时结束的同时,抢购按钮可以被点击.代码为:document.getElementById("buy").disabled = "";或者dis

js原生代码实现鼠标拖拽(超简单)

首先先来看这一张图 在这种图中,盒子的大小为512px,并且margin-left:-250px margin-top:140px;并通过一些样式让其在中部显示 这些样式都不是重要的,这里加个margin是为了让其出现拖拽的时候出现鼠标偏移,好做演示而已,不然margin:0 auto 就可以实现盒子的居中 首先通过offsetLeft的方法获取到盒子的偏移值,然后在通过clientX,clientY获取到鼠标的坐标,通过当前坐标减去offsetLeft的坐标就可以获取鼠标在div里面的 具体数