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 相关文章推荐
JS中引用百度地图并将百度地图的logo和信息去掉
Sep 29 Javascript
JS仿hao123导航页面图片轮播效果
Sep 01 Javascript
移动端脚本框架Hammer.js
Dec 15 Javascript
JQ中$(window).load和$(document).ready区别与执行顺序
Mar 01 Javascript
vue history 模式打包部署在域名的二级目录的配置指南
Jul 02 Javascript
Vue实现购物车详情页面的方法
Aug 20 Javascript
js+canvas实现纸牌游戏
Mar 16 Javascript
vue项目中自定义video视频控制条的实现代码
Apr 26 Javascript
JavaScript鼠标悬停事件用法解析
May 15 Javascript
webpack4从0搭建组件库的实现
Nov 29 Javascript
ES6字符串的扩展实例
Dec 21 Javascript
小程序wx.getUserProfile接口的具体使用
Jun 02 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
Smarty模板学习笔记之Smarty简介
2014/05/20 PHP
php中使用array_filter()函数过滤空数组的实现代码
2014/08/19 PHP
使用GDB调试PHP代码,解决PHP代码死循环问题
2015/03/02 PHP
在Mac OS下搭建LNMP开发环境的步骤详解
2017/03/10 PHP
Ajax+Json 级联菜单实现代码
2009/10/27 Javascript
判断浏览器的javascript版本的代码
2010/09/03 Javascript
动态加载图片路径 保持JavaScript控件的相对独立性
2010/09/06 Javascript
再谈querySelector和querySelectorAll的区别与联系
2012/04/20 Javascript
javascript模拟地球旋转效果代码实例
2013/12/02 Javascript
JS控制一个DIV层在指定时间内消失的方法
2014/02/17 Javascript
深入了解Node.js中的一些特性
2014/09/25 Javascript
node.js中的path.normalize方法使用说明
2014/12/08 Javascript
JavaScript中的继承之类继承
2016/05/01 Javascript
JS实现图片局部放大或缩小的方法
2016/08/20 Javascript
Javascript将图片的绝对路径转换为base64编码的方法
2018/01/11 Javascript
angularjs中$http异步上传Excel文件方法
2018/02/23 Javascript
Vue中使用 setTimeout() setInterval()函数的问题
2018/09/13 Javascript
layui表格内容溢出的解决方法
2019/09/06 Javascript
JavaScript实现4位随机验证码的生成
2021/01/28 Javascript
[31:33]2014 DOTA2国际邀请赛中国区预选赛 TongFu VS DT 第一场
2014/05/23 DOTA
Python去掉字符串中空格的方法
2014/03/11 Python
Python列表计数及插入实例
2014/12/17 Python
Mac下Anaconda的安装和使用教程
2018/11/29 Python
详解Python requests 超时和重试的方法
2018/12/18 Python
Python面向对象之类的定义与继承用法示例
2019/01/14 Python
Python reshape的用法及多个二维数组合并为三维数组的实例
2020/02/07 Python
纯CSS3实现绘制各种图形实现代码详细整理
2012/12/26 HTML / CSS
美国最大的香水出口:FragranceX.com
2017/11/04 全球购物
俄罗斯在线水暖商店:Perfecto.ru
2019/10/25 全球购物
培训主管的职业生涯规划
2014/03/06 职场文书
党的群众路线对照检查材料范文
2014/09/24 职场文书
单位作风建设自查报告
2014/10/23 职场文书
语文教师个人工作总结
2015/02/06 职场文书
安装pytorch时报sslerror错误的解决方案
2021/05/17 Python
matplotlib画混淆矩阵与正确率曲线的实例代码
2021/06/01 Python
mysql自增长id用完了该怎么办
2022/02/12 MySQL