jquery获得页面元素的坐标值实现思路及代码


Posted in Javascript onApril 15, 2013

jquery如何获得页面元素的坐标值 yulutxt是输入经典语录的输入框,feedBackMessage函数见http://www.wesoho.com/article/asp/2765.htm

var p = $("#yulutxt"); 
var yuluoffset = p.offset(); 
feedBackMessage(msg,yuluoffset.left+p.width()+10,yuluoffset.top,5000);

-------------------
1,获取对象(自定义调整打开新窗口参照元素)
var obj = $("#oButton");
实例中我获取的对象是弹出窗口按钮,这样创建的新窗口就会根椐按钮的位置进行调整,实例中将创建的新窗口显示的按钮的右下角。

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();
实例中是获取对象的右下角位置,创建新窗口的顶部位置

Javascript 相关文章推荐
基于jquery实现的上传图片及图片大小验证、图片预览效果代码
Apr 12 Javascript
JS实现可改变列宽的table实例
Jul 02 Javascript
借助JavaScript脚本判断浏览器Flash Player信息的方法
Jul 09 Javascript
js交换排序 冒泡排序算法(Javascript版)
Oct 04 Javascript
javascript设计模式之对象工厂函数与构造函数详解
Jul 30 Javascript
Jquery把获取到的input值转换成json
May 15 jQuery
vue.js与element-ui实现菜单树形结构的解决方法
Apr 21 Javascript
jQuery轮播图实例详解
Aug 15 jQuery
微信小程序canvas拖拽、截图组件功能
Sep 04 Javascript
js实现提交前对列表数据的增删改查
Jan 16 Javascript
Vue如何提升首屏加载速度实例解析
Jun 25 Javascript
使用AutoJs实现微信抢红包的代码
Dec 31 Javascript
Extjs优化(二)Form表单提交通用实现
Apr 15 #Javascript
ANT 压缩(去掉空格/注释)JS文件可提高js运行速度
Apr 15 #Javascript
Extjs优化(一)删除冗余代码提高运行速度
Apr 15 #Javascript
Extjs Gird 支持中文拼音排序实现代码
Apr 15 #Javascript
jquery+css+ul模拟列表菜单具体实现思路
Apr 15 #Javascript
js作用域及作用域链概念理解及使用
Apr 15 #Javascript
利用百度地图JSAPI生成h7n9禽流感分布图实现代码
Apr 15 #Javascript
You might like
在 PHP 中使用随机数的三个步骤
2006/10/09 PHP
PHP+DBM的同学录程序(1)
2006/10/09 PHP
php xfocus防注入资料
2008/04/27 PHP
php5 pdo新改动加载注意事项
2008/09/11 PHP
php中3des加密代码(完全与.net中的兼容)
2012/08/02 PHP
PHP生成短网址的3种方法代码实例
2014/07/08 PHP
PHP SOCKET编程详解
2015/05/22 PHP
mysql alter table命令修改表结构实例详解
2016/09/24 PHP
js给页面加style无效果的解决方法
2014/01/20 Javascript
javascript的数组和常用函数详解
2014/05/09 Javascript
jquery获取html元素的绝对位置和相对位置的方法
2014/06/20 Javascript
jQuery实现表格行上下移动和置顶效果
2015/06/05 Javascript
JavaScript对象学习小结
2015/09/02 Javascript
JavaScript中数组的合并以及排序实现示例
2015/10/24 Javascript
JavaScript中将数组进行合并的基本方法讲解
2016/03/07 Javascript
仿Angular Bootstrap TimePicker创建分钟数-秒数的输入控件
2016/07/01 Javascript
全面了解addEventListener和on的区别
2016/07/14 Javascript
JS 在数组指定位置插入/删除数据的方法
2017/01/12 Javascript
Angular.js中控制器之间的传值详解
2017/04/24 Javascript
解决Vue @submit 提交后不刷新页面问题
2020/07/18 Javascript
python运行时间的几种方法
2016/06/17 Python
Python使用openpyxl读写excel文件的方法
2017/06/30 Python
Python3使用正则表达式爬取内涵段子示例
2018/04/22 Python
python3个性签名设计实现代码
2018/06/19 Python
pygame游戏之旅 载入小车图片、更新窗口
2018/11/20 Python
python实现登录密码重置简易操作代码
2019/08/14 Python
tensorflow mnist 数据加载实现并画图效果
2020/02/05 Python
windows下Pycharm安装opencv的多种方法
2020/03/05 Python
JD Sports法国:英国篮球和运动时尚的领导者
2017/09/28 全球购物
实习生自我鉴定范文
2013/12/05 职场文书
教师专业自荐信
2014/05/31 职场文书
学校安全工作汇报材料
2014/08/16 职场文书
2015小学教师年度工作总结
2015/05/12 职场文书
CSS 圆形进度栏
2021/04/06 HTML / CSS
springboot项目以jar包运行的操作方法
2021/06/30 Java/Android
webpack介绍使用配置教程详解webpack介绍和使用
2022/06/25 Javascript