jQuery使用(十):jQuery实例方法之位置、坐标、图形(BOM)
- offset()
- position()
- scrollTop()、scrollLeft
- width()、height()
- innerWidth()、outerWidth()、innerHeight()、outerWidth()
jQuery坐标图形大小相关
offset()
返回或设置元素距离浏览器的距离{top,left}

设置浏览器距离会累计父级的浏览器距离,当设置值小于父级相对浏览器距离时会出现负样式值。
具体参数和使用方法参考手册:http://www.runoob.com/jquery/css-offset.html
position()
返回jQuery对象中第一个DOM相对于父级的距离

即相对于父级元素链上第一个定位元素的距离。(这个方法不能设置值)
具体参数和使用方法参考手册:http://www.runoob.com/jquery/css-position.html
scrollTop()、scrollLeft
返回窗口或者出现滚动条的元素的纵向和横向滚动条的距离。

获取浏览器滚动条的距离:$(window).scrollTop();
获取元素上的滚动条距离:$(".wrapper").scrollTop();
width()、height()
设置和返回元素的宽高(content区域)
innerWidth()、innerHeight()
返回第一个匹配元素的内部宽高(content+padding)
outerWidth()、outerWidth()
返回第一个匹配元素的外部宽高(padding+border)
outerWidth(true)、outerWidth(true)
传入参数true以后就会返回(padding + borde + margin)

jQuery使用(十):jQuery实例方法之位置、坐标、图形(BOM)的更多相关文章
- jQuery 第五章 实例方法 事件
.on() .one() .off() .trigger() .click / keydown / mouseenter ... .hover() ----------------------- ...
- jQuery滚动条回到顶部或指定位置
jQuery滚动条回到顶部或指定位置 在很多网站,为了增强用户体验,我们会看到回到顶部的按钮,不用手动拖拽滚动条就能回到顶部,非常方便.下面就介绍用jquery实现的滚动到顶部的代码 $(functi ...
- 第四十四课:jQuery UI和jQuery easy UI
jQuery UI是jQuery官方提供的功能效果和UI样式.作为官方出的东西,它一直没有被人们看重,一是它没有datagrid,tree等UI库必备的东西,二是它修改太过频繁,体积庞大.其实它所有以 ...
- jQuery 第五章 实例方法 详解内置队列queue() dequeue() 方法
.queue() .dequeue() .clearQueue() ------------------------------------------------------------------ ...
- jQuery 第四章 实例方法 DOM操作之data方法
jquery 里面 的 data 方法比较重要, 所以成一个模块写: 首先, 得知道 data() 干嘛用的, 看淘宝上 有自定义的属性, 为data - 什么什么, 这是为了dom 跟数据有 ...
- 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式
本系列文章导航 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式 一.摘要 本篇文章讲解如何使用jQuery获取和操作元素的属性和CSS样式. 其中DOM属性和元素属性的区分值得 ...
- jQuery学习-什么是jquery? Js与jquery之间的关系 Jquery选择器
1. 什么是jQuery以及学习的意义等 jQuery是一个js库 JS库是什么? 把常用的方法,进行封装,封装到一个单独的js文件当中,要用的时候直接调用. 学习jQuery主要学什么? 学习jQ ...
- 区别和详解:jQuery extend()和jQuery.fn.extend()
1.认识jQuery extend()和jQuery.fn.extend() jQuery的API手册中,extend方法挂载在jQuery和jQuery.fn两个不同对象上方法,但在jQuery内部 ...
- jQuery.extend和jQuery.fn.extend的区别?
jquery 本身 是由 Resig: 莱希格, 一个美国的小伙子小伙伴开发的, 在2005年 prototype发表之后, 在2006年1月发表的, 后来进入mozilla工作, mozilla的j ...
随机推荐
- 本地系统服务例程:Nt和Zw系列函数
Windows本地操作系统服务API由一系列以Nt或Zw为前缀的函数实现的,这些函数以内核模式运行,内核驱动可以直接调用这些函数,而用户层程序只能通过系统进行调用.通常情况下用户层应用程序不会直接调用 ...
- 创建你的第一个Composer/Packagist包
今天我们要介绍一下如何通过Composer和Packagist向PHP社区贡献代码包.首先,如果你是一个PHP开发者但是还不知道什么是Composer,请先参考了一下这篇文章http://docs.p ...
- Linux学习之路(二)
4.Linux文件查找工具. Linux经常使用locate与find作为文件查找命令.find可以认为是系统自带的命令,功能也挺多但是使用方法相对有点繁琐.find查找的是实时文件数据,一般用于查询 ...
- SQLServer之创建辅助XML索引
创建辅助XML索引 使用 CREATE INDEX (Transact-SQL)Transact-SQL DDL 语句可创建辅助 XML 索引并且可指定所需的辅助 XML 索引的类型. 创建辅助 XM ...
- velocity模板引擎 -- java.io.FileNotFoundException: velocity.log (Permission denied)
问题原因是velocity的日志框架导致(velocity是使用自己封装的日志框架记录日志的),velocity在初始化Logger时,如果没有读取到配置文件,则会使用默认的velocity.log做 ...
- 文本分类实战(八)—— Transformer模型
1 大纲概述 文本分类这个系列将会有十篇左右,包括基于word2vec预训练的文本分类,与及基于最新的预训练模型(ELMo,BERT等)的文本分类.总共有以下系列: word2vec预训练词向量 te ...
- 001_ jQuery的表格插件dataTable详解
一. 1.启用id为"datatable1"标签的html的表格jQuery库 $("#datatable1").dataTable( ) Reference: ...
- ASP.NET Core 微服务初探[1]:服务发现之Consul
ASP.NET Core 微服务初探[1]:服务发现之Consul 在传统单体架构中,由于应用动态性不强,不会频繁的更新和发布,也不会进行自动伸缩,我们通常将所有的服务地址都直接写在项目的配置文件 ...
- SpringCloud(1)服务注册与发现Eureka
1.创建1个空白的工程 2.创建2个model工程 一个module(即SpringBoot)工程作为服务注册中心,即Eureka Server,另一个作为Eureka Client. Eureka ...
- 关于Jpa和Mybatis的一些看法
现在网络上充斥着Jpa和Mybatis的一些对比.其实狭义上来说是hibernate和mybatis之间的比较. 例如:为什么感觉国内比较流行的 mybatis 在国外好像没人用的样子? 下面是一些截 ...