获取页面某一元素的绝对X,Y坐标，可以用offset()方法：

var X = $('#DivID').offset().top;

var Y = $('#DivID').offset().left;

获取相对(父元素)位置:

var X = $('#DivID').position().top;

var Y = $('#DivID').position().left;

让Div随滚动条移动：

<div id="oLayer" style="position: absolute; left: 0; top:80px; z-index: 2; background: a9c9ef; margin-left:6px;

            width: 140px; height: 70px">

</div>

jQuery代码：

       $(window).scroll(function() {

                                            var init_pos = $('#oLayer').offset().top;

                                            $('#oLayer').css("top", $(window).scrollTop()+80)

                                        });
$(document).bind('mousemove',function(e){

var x =        e.pageX;

var y = e.pageY;

    });
获取浏览器显示区域（可视区域）的高度 ：   
$(window).height();   
获取浏览器显示区域（可视区域）的宽度 ：
$(window).width();   
获取页面的文档高度   
$(document).height();   
获取页面的文档宽度 ：
$(document).width(); 
浏览器当前窗口文档body的高度：  
$(document.body).height();
浏览器当前窗口文档body的宽度： 
$(document.body).width();
获取滚动条到顶部的垂直高度 (即网页被卷上去的高度)  
$(document).scrollTop();   
获取滚动条到左边的垂直宽度 ：
$(document).scrollLeft(); 
获取或设置元素的宽度：
$(obj).width();
获取或设置元素的高度：
$(obj).height();
某个元素的上边界到body最顶部的距离：obj.offset().top;（在元素的包含元素不含滚动条的情况下）
某个元素的左边界到body最左边的距离：obj.offset().left;（在元素的包含元素不含滚动条的情况下）
返回当前元素的上边界到它的包含元素的上边界的偏移量：obj.offset().top（在元素的包含元素含滚动条的情况下）
返回当前元素的左边界到它的包含元素的左边界的偏移量：obj.offset().left（在元素的包含元素含滚动条的情况下）
 
scrollTop(), scrollLeft()
设置或返回已经滚动到元素的左边界或上边界的像素数。简单地说，就是设置或者获取匹配元素相对滚动条上侧或者左侧的偏移。只有在元素有滚动条的时候，例如，元素的 CSS overflow 属性设置为 auto 的时候，这些像素才有用。这些属性也只在文档的 <body> 或 <html> 标记上定义（这和浏览器有关），并且一起来制定滚动文档的位置。注意，这些属性并不会指定一个 <iframe> 标记的滚动量。这是非标准的但却得到很好支持的属性

jquery获取元素坐标获取鼠标坐标的更多相关文章

  1. 通过ID获取元素 注:获取的元素是一个对象，如想对元素进行操作，我们要通过它的属性或方法。

    通过ID获取元素 学过HTML/CSS样式,都知道,网页由标签将信息组织起来,而标签的id属性值是唯一的,就像是每人有一个身份证号一样,只要通过身份证号就可以找到相对应的人.那么在网页中,我们通过id ...

  2. js 获取元素坐标 和鼠标点击坐标

    js 获取元素的位置 var odiv=document.getElementById('divid'); alert(odiv.getBoundingClientRect().left); aler ...

  3. 详细解析 JavaScript 获取元素的坐标

    引言 最近突然看到了有关图片懒加载的问题,大致意思就是初始状态下页面只加载浏览器可视区域的图片,剩余图片在当浏览器可视区域滚动到其位置时才开始加载.貌似现在许多大型网站都有实现懒加载,所以我便就此问题 ...

  4. 002--VS C++ 获取鼠标坐标并显示在窗口上

    //--------------------------------------------MyPaint() 函数------------------------------------------ ...

  5. jQuery如何获取元素及选择器的参考

    获取元素 Jquery当中几乎所有的功能.选择.事件处理等都用到了这个函数.通常用来获取元素,获取到的元素都会被存储为jQuery对象. 例如: 先设定一个id为aaa的div <body> ...

  6. iframe多层嵌套时,Jquery获取元素

    在项目中,尤其是后台管理项目,会使用到iframe嵌套的网页,说起iframe,真的是个让人头疼的东西,能避开是最好避开.不然要请随身备好氧气瓶哈(因为管理和调试过程中往往会被气缺氧!!!哈哈哈~~~ ...

  7. 自动化测试基础篇--Selenium获取元素属性

    摘自https://www.cnblogs.com/sanzangTst/p/8375938.html 通常在做断言之前,都要先获取界面上元素的属性,然后与期望结果对比. 一.获取页面title 二. ...

  8. UI自动化之特殊处理四（获取元素属性\爬取页面源码\常用断言）

    获取元素属性\爬取页面源码\常用断言,最终目的都是为了验证我们实际结果是否等于预期结果 目录 1.获取元素属性 2.爬取页面源码 3.常用断言 1.获取元素属性 获取title:driver.titl ...

  9. JavaScript通过ID获取元素坐标

    JavaScript通过ID获取元素坐标 function getElementPos(elementId) {    var ua = navigator.userAgent.toLowerCase ...

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

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

随机推荐

  1. JS/CSS 各种操作信息提示效果

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  2. vue2.0实现银行卡类型种类的选择

    功能效果:vue2.0实现银行卡类型种类的选择 图片.png 参考代码如下: <template> <div class="app"> <header ...

  3. WPF MVVM示例自定义模板数据绑定

    在触摸屏设备上.由于列表是的信息展示不是非常直观和便捷操作. 所以也就出现了很多用面板控件:类似win10的Metro风格, 所以抽空做了一个WPF面板控件. 话不多上 , 先上一个示例图. 为了便于 ...

  4. 老调重弹：JDBC系列 之 &lt;驱动载入原理全面解析&gt;

    前言 近期在研究Mybatis框架,因为该框架基于JDBC.想要非常好地理解和学习Mybatis,必需要对JDBC有较深入的了解.所以便把JDBC 这个东东翻出来.好好总结一番,作为自己的笔记,也是给 ...

  5. HTML实体与网页编码(汉字转化为了html实体) .

    http://blog.csdn.net/f438952359/article/details/7481267 HTML实体与网页编码(汉字转化为了html实体) . htmlencodingfunc ...

  6. Flask项目之手机端租房网站的实战开发（十一）

    说明:该篇博客是博主一字一码编写的,实属不易,请尊重原创,谢谢大家! 接着上一篇博客继续往下写 :https://blog.csdn.net/qq_41782425/article/details/8 ...

  7. 【例题 7-10 UVA - 11212】Editing a Book

    [链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 迭代加深搜. 很容易想到,最多只要搜8层就可以得到答案了 ->最多8下肯定可以还原. 则枚举一下最大层数.然后做个深搜就好. ...

  8. 我在世界最热创业孵化器YC学到的58件事

    Amir Elaguizy是网络扑克游戏平台MarketZero创始人,2011年,他创立的这家公司被Zynga收购,后在Zynga担任HTML5扑克游戏的CTO.目前他同时是社会化点评网站lark. ...

  9. LeetCode Algorithm 04_Median of Two Sorted Arrays

    There are two sorted arrays A and B of size m and n respectively. Find the median of the two sorted ...

  10. postman--基本使用2

    本文转自:http://blog.csdn.net/u013613428/article/details/51557804 最近需要测试产品中的REST API,无意中发现了PostMan这个chro ...