javascript获取元素离文档各边距离的方法


Posted in Javascript onFebruary 13, 2015

本文实例讲述了javascript获取元素离文档各边距离的方法。分享给大家供大家参考。具体实现方法如下:

function getDistance(obj) {  

 if (!obj instanceof jQuery) {  

     obj = $(obj);  

 }  

 var distance = {};  

 distance.top = (obj.offset().top - $(document).scrollTop());  

 distance.bottom = ($(window).height() - distance.top - obj.outerHeight());  

 distance.left = (obj.offset().left - $(document).scrollLeft());  

 distance.right = ($(window).width() - distance.left - obj.outerWidth());  

 return distance;  

}

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
JavaScript入门教程(9) Document文档对象
Jan 31 Javascript
JavaScript语言核心数据类型和变量使用介绍
Aug 23 Javascript
JS实现让访问者自助选择网页文字颜色的方法
Feb 24 Javascript
JS和css实现检测移动设备方向的变化并判断横竖屏幕
May 25 Javascript
javascript实现检验的各种规则
Jul 31 Javascript
JavaScript常用本地对象小结
Mar 28 Javascript
jquery遍历json对象集合详解
May 18 Javascript
手机软键盘弹出时影响布局的解决方法
Dec 15 Javascript
vue实现表格数据的增删改查
Jul 10 Javascript
RxJS的入门指引和初步应用
Jun 15 Javascript
基于vue写一个全局Message组件的实现
Aug 15 Javascript
Vue filter 过滤当前时间 实现实时更新效果
Dec 20 Javascript
jQuery点缩略图弹出层显示大图片
Feb 13 #Javascript
Js控制滑轮左右滑动实例
Feb 13 #Javascript
JavaScript函数作用域链分析
Feb 13 #Javascript
JavaScript匿名函数用法分析
Feb 13 #Javascript
js实现进度条的方法
Feb 13 #Javascript
动态加载js的方法汇总
Feb 13 #Javascript
jQuery EasyUI datagrid实现本地分页的方法
Feb 13 #Javascript
You might like
全国FM电台频率大全 - 8 黑龙江省
2020/03/11 无线电
PHP将进程作为守护进程的方法
2015/03/19 PHP
php操作redis数据库常见方法实例总结
2020/02/20 PHP
yii框架结合charjs统计上一年与当前年数据的方法示例
2020/04/04 PHP
PHP文件操作简单介绍及函数汇总
2020/12/11 PHP
Javascript中的delete介绍
2012/09/02 Javascript
jQuery对象和Javascript对象之间转换的实例代码
2013/03/20 Javascript
JS模板实现方法
2013/04/03 Javascript
javascript生成json数据简单示例分享
2014/02/14 Javascript
js锁屏解屏通过对$.ajax进行封装实现
2014/07/31 Javascript
jquery实现仿新浪微博评论滚动效果
2015/08/06 Javascript
JavaScript为事件句柄绑定监听函数实例详解
2015/12/15 Javascript
理解jquery事件冒泡
2016/01/03 Javascript
js实现ctrl+v粘贴上传图片(兼容chrome、firefox、ie11)
2016/03/09 Javascript
js省市县三级联动效果实例
2020/04/15 Javascript
基于JS实现导航条之调用网页助手小精灵的方法
2016/06/17 Javascript
JS for循环中i++ 和 ++i的区别介绍
2016/07/20 Javascript
js实现类bootstrap模态框动画
2017/02/07 Javascript
Angular5升级RxJS到5.5.3报错:EmptyError: no elements in sequence的解决方法
2018/04/09 Javascript
微信小程序实现选择地址省市区三级联动
2020/06/21 Javascript
python函数返回多个值的示例方法
2013/12/04 Python
Python tkinter布局与按钮间距设置方式
2020/03/04 Python
Keras Convolution1D与Convolution2D区别说明
2020/05/22 Python
浅析Python 中的 WSGI 接口和 WSGI 服务的运行
2020/12/09 Python
python批量提取图片信息并保存的实现
2021/02/05 Python
详解CSS3实现响应式手风琴效果
2020/06/10 HTML / CSS
联想美国官方商城:Lenovo美国
2017/06/19 全球购物
海蓝之谜(LA MER)澳大利亚官方商城:全球高端奢华护肤品牌
2017/10/27 全球购物
应用电子技术专业个人求职信
2013/09/21 职场文书
假日旅行社实习自我鉴定
2013/09/24 职场文书
村委会贫困证明
2014/01/14 职场文书
个人年终总结结尾
2015/03/06 职场文书
讲文明倡议书
2015/04/29 职场文书
2016年教师学习廉政准则心得体会
2016/01/20 职场文书
python 三边测量定位的实现代码
2021/04/22 Python