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 相关文章推荐
jQuery EasyUI API 中文文档 - EasyLoader 加载器
Sep 29 Javascript
javascript 事件处理程序介绍
Jun 27 Javascript
jquery使用jquery.zclip插件复制对象的实例教程
Dec 04 Javascript
JS实现的车标图片提示效果代码
Oct 10 Javascript
jqGrid用法汇总(全经典)
Jun 28 Javascript
Bootstrap编写一个同时适用于PC、平板、手机的登陆页面
Jun 30 Javascript
bootstrap制作jsp页面(根据值让table显示选中)
Jan 05 Javascript
微信小程序 image组件binderror使用例子与js中的onerror区别
Feb 15 Javascript
详解基于Node.js的微信JS-SDK后端接口实现代码
Jul 15 Javascript
js正则表达式校验指定字符串的方法
Jul 23 Javascript
vue项目中使用lib-flexible解决移动端适配的问题解决
Aug 23 Javascript
解决vue项目获取dom元素宽高总是不准确问题
Jul 29 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
支持oicq头像的留言簿(一)
2006/10/09 PHP
使用迭代器 遍历文件信息的详解
2013/06/08 PHP
控制PHP的输出:缓存并压缩动态页面
2013/06/11 PHP
关于PHP模板Smarty的初级使用方法以及心得分享
2013/06/21 PHP
PHP检测移动设备类mobile detection使用实例
2014/04/14 PHP
PHP小技巧之函数重载
2014/06/02 PHP
php实现在服务器端调整图片大小的方法
2015/06/16 PHP
拖拉表格的JS函数
2008/11/20 Javascript
解决遍历时Array.indexOf产生的性能问题
2012/07/03 Javascript
Javascript中数组方法汇总(推荐)
2015/04/01 Javascript
纯javascript实现的小游戏《Flappy Pig》实例
2015/07/27 Javascript
Javascript中的return作用及javascript return关键字用法详解
2015/11/05 Javascript
Zabbix添加Node.js监控的方法
2016/10/20 Javascript
javascript实现根据函数名称字符串动态执行函数的方法示例
2016/12/28 Javascript
利用CSS、JavaScript及Ajax实现图片预加载的三大方法
2017/01/22 Javascript
vue元素实现动画过渡效果
2017/07/01 Javascript
在vue-cli中组件通信的方法
2017/12/16 Javascript
关于NodeJS中的循环引用详解
2019/07/23 NodeJs
使用AutoJs实现微信抢红包的代码
2020/12/31 Javascript
使用Python内置的模块与函数进行不同进制的数的转换
2016/03/12 Python
Python实现的合并两个有序数组算法示例
2019/03/04 Python
Python实现将HTML转成PDF的方法分析
2019/05/04 Python
python2.7 安装pip的方法步骤(管用)
2019/05/05 Python
Python3+Appium实现多台移动设备操作的方法
2019/07/05 Python
Python 利用高德地图api实现经纬度与地址的批量转换
2019/08/14 Python
Pytorch Tensor基本数学运算详解
2019/12/30 Python
Keras 中Leaky ReLU等高级激活函数的用法
2020/07/05 Python
CSS3 优势以及网页设计师如何使用CSS3技术
2009/07/29 HTML / CSS
英国奢侈品网站:MatchesFashion
2016/12/16 全球购物
Bluebella法国官网:英国性感内衣品牌
2019/05/03 全球购物
军训心得体会
2013/12/31 职场文书
英语国培研修感言
2014/02/13 职场文书
一年级学生评语大全
2014/04/21 职场文书
村主任“四风”问题个人对照检查材料思想汇报
2014/10/02 职场文书
golang中实现给gif、png、jpeg图片添加文字水印
2021/04/26 Golang
Java9新特性之Module模块化编程示例演绎
2022/03/16 Java/Android