位置: 编程技术 - 正文

jQuery 1.9.1源码分析系列(十三)之位置大小操作(jquery fadein 源码)

编辑:rootadmin

推荐整理分享jQuery 1.9.1源码分析系列(十三)之位置大小操作(jquery fadein 源码),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:jquery源码是什么水平,jquery源码是什么水平,jquery.min.js源代码,jquery源码是什么水平,jquery.min.js源代码,jquery源码实现原理,jquery源码分析,jquery源码分析,内容如对您有帮助,希望把文章链接给更多的朋友!

先给大家展示谢

jQuery.fn.css (propertyName [, value ]| object )(函数用于设置或返回当前jQuery对象所匹配的元素的css样式属性值。如果需要删除指定的css属性,请使用该函数将其值设为空字符串("")

  注意:1、如果省略了value参数,则表示获取属性值;如果指定了该参数,则表示设置属性值。2、css()函数的所有"设置"操作针对的是当前jQuery对象所匹配的每一个元素;所有"读取"操作只针对第一个匹配的元素。)

jQuery.fn.offset([coordinatesObj])(设置或返回当前匹配元素(将content+padding+border看成一个整体)相对于当前文档的偏移,也就是相对于当前文档的坐标。该函数只对可见元素有效。该函数返回一个坐标对象(Object),该对象有一个left属性和top属性。属性值均为数字,它们都以像素(px)为单位。与position()不同的是:offset()返回的是相对于当前文档的坐标,position()返回的是相对于其定位的祖辈元素的坐标。)

jQuery.fn.position()(返回当前匹配元素(将content+padding+border+margin看成一个整体)相对于其被定位的祖辈元素的偏移,也就是相对于被定位的祖辈元素的坐标。该函数只对可见元素有效。所谓"被定位的元素",就是元素的CSS position属性值为absolute、relative或fixed(只要不是默认的static即可)。该函数返回一个坐标对象,该对象有一个left属性和top属性。属性值均为数字,它们都以像素(px)为单位。与offset()不同的区别详见offset。此外,position()函数无法用于设置操作。如果当前元素的祖辈元素全部都是默认定位(static),那么该函数返回的偏移位置与offset()函数相同)

jQuery.fn.scrollLeft([ value ])(设置或返回当前匹配元素相对于水平滚动条左侧的偏移。当一个元素的实际宽度超过其显示区域的宽度时,在一定的设置下,浏览器会为该元素显示相应的水平滚动条。此时,scrollLeft()返回的就是该元素在可见的滚动区域左侧被隐藏部分的宽度(单位:像素)。

  如果水平滚动条在最左侧(也就是可见区域左侧没有被隐藏的内容),或者当前元素是不可水平滚动的,那么scrollLeft()将返回0。对可见的和隐藏的元素均有效。)

jQuery.fn.scrollTop([ value ])(设置或返回当前匹配元素相对于垂直滚动条顶部的偏移。当一个元素的实际高度超过其显示区域的高度时,在一定的设置下,浏览器会为该元素显示相应的垂直滚动条。此时,scrollTop()返回的就是该元素在可见区域之上被隐藏部分的高度(单位:像素)。如果垂直滚动条在最上面(也就是可见区域之上没有被隐藏的内容),或者当前元素是不可垂直滚动的,那么scrollTop()将返回0。对可见的和隐藏的元素均有效)

jQuery.fn.height([ value ])(设置或返回当前匹配元素的高度。该高度值不包括元素的外边距(margin)、内边距(padding)、边框(border)等部分的高度。如下图

  

  如果你要获取包括上述某部分在内的高度,请使用innerHeight()和outerHeight()。该函数属于jQuery对象(实例),并且对不可见的元素依然有效)

jQuery.fn.innerHeight([ value ])(设置或返回当前匹配元素的内高度。该高度值包括内边距(padding),但不包括元素的外边距(margin)、边框(border)等部分的高度。如下图:

  

  该函数属于jQuery对象(实例),并且对不可见的元素依然有效)

jQuery.fn.outerHeight([includeMargin])(设置或返回当前匹配元素的外高度。该高度值包括内边距(padding) 、边框(border),但不包括元素的外边距(margin)部分的高度。你也可以指定参数为true,以包括外边距(margin)部分的高度如下图:

  

  该函数属于jQuery对象(实例),并且对不可见的元素依然有效)

jQuery.fn.width([ value ])(描述:略)

jQuery.fn.innerWidth ([ value ])(描述:略)

jQuery.fn.outerWidth ([includeMargin])(描述:略)

  借用孤月蓝风上色的详解图

jQuery 1.9.1源码分析系列(十三)之位置大小操作(jquery fadein 源码)

  接下来分析部分函数。

a.jQuery.fn.offset分析

  offset获取的方法如下(以top为例):

  offset.top = elem距浏览器视窗顶部的位置 + 文档顶部被卷起来的部分 ? elem距离父元素上边框高度top。

  jQuery处理就变成了:

  这里面IE8-和IE9+等现代浏览器有个差别,使用document.documentElement.getBoundingClientRect();IE8-的top/left值为-2px;其他现代浏览器top/left值为0px;可以看出IE8-浏览器是以窗口的(2,2)坐标为原点坐标的。

  浏览器会默认body和窗口之间有8px的间隙,所以使用document.body.getBoundingClientRect(); 得到的top/left值为8px。

  offset的设置方法如下(以top为例):

  需要注意在设置之前,如果当前elem的position为static则要设置为relative才能处理

  先得到要设置给elem的css特征top的值计算方法为

  setTop = (要设置的offset top值 ? 当前元素的offset top值)+ elem的css top特征值

  然后将setTop设置给elem的css top特征。

  jQuery的处理就变成了:

b.jQuery.fn.position

  position只能获取不能设置,获取方法如下(以top为例):

  position.top = elem的offsetTop - elem被定位的祖辈元素的offsetTop ? elem的marginTop值

  这里面这个top就真的是elem的css属性top的值了。对于jQuery来说这个elem把width+padding+border+margin看成了一个整体,所以最终得到的top是elem这个整体距离被定为祖辈元素顶部内边的距离。

  jQuery的处理变成了:

  里面jQuery.fn.offsetParent()函数获取最近的祖先定位元素。

c.jQuery.fn.scrollLeft和jQuery.fn.scrollTop

  这两个函数的获取和设置滚动条位置比较简单,以scrollTop为获取无非就只有两个函数window[ pageYOffset]或elem [scrollTop]。而设置直接使用window[scrollTo]或elem[scrollTop]

以上内容是小编给大家介绍的关于jQuery 1.9.1源码分析系列(十三)之位置大小操作,希望大家喜欢。

jQuery 1.9.1源码分析系列(十四)之常用jQuery工具 为了给下一章分析动画处理做准备,先来看一下一些工具。其中队列工具在动画处理中被经常使用。jQuery.fn.queue(([queueName][,newQueue])||([queueName,]callback))(

Jquery左右滑动插件之实现超级炫酷动画效果附源码下载 分享一款基于jQuery超级酷动画滑动插件。这是一款基于jquery.pogo-slider插件实现的多个滑块切换特效。效果图如下,如果大家觉得还不错,很满意可以下

jQuery实现获取绑定自定义事件元素的方法 本文实例讲述了jQuery实现获取绑定自定义事件元素的方法。分享给大家供大家参考,具体如下:(function($){//自定义itemtab事件$.fn.bind=function(types,data,fn){//

标签: jquery fadein 源码

本文链接地址:https://www.jiuchutong.com/biancheng/376188.html 转载请保留说明!

上一篇:解决jQuery使用JSONP时产生的错误(jquery 使用)

下一篇:jQuery 1.9.1源码分析系列(十四)之常用jQuery工具(jquery1.8)

  • 发票隔月作废怎么操作
  • 装修款需要开发票吗
  • 投资入股变更股权比例
  • 如何从对公账户的资金情况来确定案件,发现犯罪嫌疑人?
  • 多项固定资产能否合并入账
  • 房地产公司转让土地
  • 适用于6%税率的优惠
  • 外经证预缴附加税
  • 分配本月职工薪酬会计分录该怎么做合适?
  • 个体工商户税收起征点是多少?
  • 因增资扩股导致股价下跌
  • 购置办公大楼
  • 其他应付款重分类到哪个科目
  • 应交税费账户进项税额为借方是什么意思?
  • 税务分析最常用的分析方法
  • 转让法人要注意什么
  • 实收资本账簿印花税需要每年交吗
  • 小规模纳税人国企
  • 金税盘密码忘记了打客服有用吗?
  • 研发人员的工会经费计入研发费用吗
  • 固定资产提前报废账务处理
  • 电子税务局怎么变更财务负责人
  • 不是公户付的款开发票可以做账吗
  • 筹办期间的筹办费用支出
  • 100%控股有什么风险
  • OS X Yosemite系统怎么样 OS X Yosemite功能介绍
  • 微信聊天记录备份和恢复
  • php导出数据到excel
  • 企业工会经费计提比例
  • 怎么在bios里设置usb开关
  • dghm.exe是什么程序
  • info.exe
  • php日期时间函数
  • 工业企业出售边角余料交的增值税税率是多少
  • 制造企业成本计算模型有哪些类型
  • f12开发者工具调试打不开
  • 企业安全生产费用不得出现赤字
  • 黑色金属冶炼压延品的税收编码是多少
  • opencv开发项目
  • php _dir_
  • 子公司提取盈余公积 合并抵消
  • flask实现登录
  • python pyecharts
  • 长期借款的主要成本包括
  • Linux下socket实现网页抓取 Unicorn 博客频道 CSDN.NET
  • 会计做账需要银行交易明细吗
  • 研发费用范围归集不正确
  • 中国源码亲测网
  • 应付职工薪酬的账务处理
  • 对公账户是怎样的
  • 失业保险金领取多少钱
  • 税收返还会计处理方法
  • 什么时候计提增值税发票
  • 哪些固定资产不需要计提折旧
  • 项目资本金如何确定
  • 工资完税证明怎么开
  • 企业应该设置几个安全管理人员
  • windows2008关闭ie增强
  • 服务主机windows错误报告
  • macpr预设
  • mac如何通过终端启动
  • linux常用命令修改
  • 硬盘分几个区最好
  • windows8怎么调整亮度
  • 计算机策略设置
  • win8.1技巧
  • winxp能玩啥大型游戏
  • 防止linux断电系统崩溃
  • windows听歌软件
  • android点击按钮弹出对话框
  • celery使用
  • python中迭代器的作用
  • python xml.dom.minidom模块生成xml
  • 重庆电子税务局网页版登录
  • 国考什么时候开始备考比较好
  • 回家税务总局全国增值税发票查询
  • 契税房屋套数如何计算
  • 进项税留抵怎么消化掉
  • 新车交了购置税后给什么凭证
  • 房屋维修税率是多少
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设