jquery 获取鼠标和元素的坐标点
- $('img').mousemove(function(e) {
- varpositionX=e.pageX-$(this).offset().left; //获取当前鼠标相对img的X坐标
- varpositionY=e.pageY-$(this).offset().top; //获取当前鼠标相对img的Y坐标
- console.log(positionX+' '+positionY);
- })
- $('img').mousemove(function(e) {
- var xx = e.originalEvent.x ||e.originalEvent.layerX || 0;
- var yy = e.originalEvent.y ||e.originalEvent.layerY || 0;
- console.log(xx+' '+yy);
- })
- $('img').mousemove(function(e) {
- var pageX=e.pageX;
- var pageY=e.pageY;
- console.log(pageX+' '+pageY);
- })
1,获取对象
var obj = $("#image");
2,获取对象元素的位置(offset()方法)
var offset = obj.offset();
获取对象元素的位置,分别是元素的top和left,调用方法是:offset.left和offset.top,可知当前对象的左部和顶部位置。
3,获取对象元素的宽度(width()方法)
var right = offset.left+obj.width();
实例中是获取对象的右下角位置,创建新窗口的左部位置。
4,获取对象元素的高度(height()方法)
var down =offset.top+obj.height();
实例中是获取对象的右下角位置,创建新窗口的顶部位置。
- <scripttype="text/javascript">
- $(document).ready(function(){
- alert($(window).height());//浏览器当前窗口可视区域高度
- alert($(document).height());//浏览器当前窗口文档的高度
- alert($(document.body).height());//浏览器当前窗口文档body的高度
- alert($(document.body).outerHeight(true));//浏览器当前窗口文档body的总高度包括border padding margin
- alert($(window).width());//浏览器当前窗口可视区域宽度
- alert($(document).width());//浏览器当前窗口文档对象宽度
- alert($(document.body).width());//浏览器当前窗口文档body的高度
- alert($(document.body).outerWidth(true));//浏览器当前窗口文档body的总宽度包括border padding margin
- })
- </script>
jquery 获取鼠标和元素的坐标点的更多相关文章
- jquery如何获得页面元素的坐标值
http://www.cnblogs.com/pansly/archive/2011/05/25/2056222.html jquery如何获得页面元素的坐标值 yulutxt是输入经典语录的输入 ...
- jquery获取和设置元素高度宽度
jquery获取和设置元素高度宽度 1.height()/ width() 取得第一个匹配元素当前计算的高度/宽度值(px) height(val)/ width(val) 为每个匹配的元素设置CSS ...
- jQuery获取或设置元素的宽度和高度
jQuery获取或设置元素的宽度和高度: 可使用以下3种方法: 1,jQuery width() 和 height() 方法: 2,innerWidth() 和 innerHeight() 方法: 3 ...
- jquery获取含有某元素的的控件 “控件名[属性名=值]”
jquery获取含有某元素的的控件 “控件名[属性名=值]”. 如,获取 <input id="${cheackbox}" data-role="icheck&qu ...
- jquery获取的html元素和document获取的元素的区别
最近通过ocx做了一个视频插件,然后将插件放到html中(想知道的可以看一下) 因为我要操作这个插件,要播放,停止等,所以我需要获取这个元素,不出意外的,我就用jquery来获取,然后根本无法执行,然 ...
- 利用jQuery获取鼠标当前的坐标
文字来源:http://www.smalluv.com/jquery_code_106.html jQuery获取当前鼠标坐标位置: <div id="testDiv"> ...
- Jquery取得iframe中元素的几种方法Javascript Jquery获取Iframe的元素、内容或者ID
query取得iframe中元素的几种方法 在iframe子页面获取父页面元素代码如下: $('#objId', parent.document);// 搞定... 在父页面 获取iframe子页面的 ...
- coding++:JS/jQuery获取兄弟姐妹等元素
jQuery获取: jQuery.parent(expr),找父亲节点,可以传入expr进行过滤,比如$("span").parent()或者$("span") ...
- JQuery 获取父级元素、同级元素、子元素等
例: <div> <div id="div_1">这是内容1</div> <div id="div_2">这是内 ...
随机推荐
- 关于vue.js中事件处理器的练习
html: <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8 ...
- LEETCODE —— Unique Paths II [动态规划 Dynamic Programming]
唯一路径问题II Unique Paths II Follow up for "Unique Paths": Now consider if some obstacles are ...
- (转) Summary of NIPS 2016
转自:http://blog.evjang.com/2017/01/nips2016.html Eric Jang Technology, A.I., Careers ...
- Java-接口和抽象类区别
在类的设计中,需要明确一个原则,一个类不要去继承一个已经实现好的类,只能继承抽象类或实现接口,如果接口和抽象类都可以使用,那么优先使用接口,避免继承局限
- Yii2.0中form->field如何获取主表的一个字段并且设置为只读
<?= $form->field($model, 'last_login_time')->textInput(['readonly' => 'true']) ?>
- Ubuntu 16.04 安装ftp服务器传输文件
最近在搞深度学习,老师比较宝贝他的服务器,要求我以后负责管理服务器.往后所有要使用服务器的人都必须向我申请账号,然后只允许客户端访问,使用文件传输软件传输文件.像我这样一个linux菜逼,这种要求不是 ...
- ILGenerator.Emit动态 MSIL编程(三)之动态代理
using System; using System.Linq; using System.Reflection; using System.Reflection.Emit; public seale ...
- iOS10 权限配置
升到iOS10之后,需要设置权限的有: 麦克风权限:Privacy - Microphone Usage Description 是否允许此App使用你的麦克风? 相机权限: Privacy - Ca ...
- chart.js插件生成折线图时数据普遍较大时Y轴数据不从0开始的解决办法[bubuko.com]
chart.js插件生成折线图时数据普遍较大时Y轴数据不从0开始的解决办法,原文:http://bubuko.com/infodetail-328671.html 默认情况下如下图 Y轴并不是从0开始 ...
- 为模版设计师而生的Twig(下)-Twig使用指南
原文地址:http://my.oschina.net/veekit/blog/276800 12. 模板继承 Twig最强大的部分是模板继承.模板继承允许你建立一个基本的"骨架"模 ...