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 ...
随机推荐
- Docker资源限制
我们在容器中运行docker镜像的时候,可以指定一些设置容器cpu和内存的相关参数来进行限制,这样子尽量把容器资源做的相对稳定一些.这些参数是在docker run/create命令使用,比如: -- ...
- zabbix监控Oracle
可监控项 使用zabbix监控oracle数据库需要借助第三方的插件,目前使用较多的是orabbix.目前维护到了1.2.3版本.关于oracle自带的监控项目有以下几个: DB Version (i ...
- Windows Service 学习系列(三)——循环引擎 ICycleEngine
摘要:转载:https://www.cnblogs.com/zhuweisky/archive/2009/09/01/1557792.html#undefined 1.缘起: 有些系统需要每隔一段时间 ...
- 详解vuex结合localstorage动态监听storage的变化
这篇文章主要介绍了详解vuex结合localstorage动态监听storage的变化,小编觉得挺不错的,现在分享给大家,也给大家做个参考.一起跟随小编过来看看吧 需求:不同组件间共用同一数据,当一个 ...
- linux安装成功后怎么调出终端
一.Ubuntu 桌面如下,点击搜索 二.输入terminal 终端 三.锁定到菜单栏 四.接下来就可以练习linux下的常用命令,如:ls mkdir cat touch 等等 这些命令后 ...
- Python小数据池和字典操作
小数据池 #id 查看内存地址 #多个代码块可以使用小数据池 #一个代码块中有一个问题,就是重复使用 #数字 -5~256 #字符串 字符串 乘法总数长度不能超过20, 0,1除外 #不能有特殊字符 ...
- 网易云歌词解析(配合audio标签实现本地歌曲播放,歌词同步)
先看下效果 github上做的一个音乐播放器: https://github.com/SorrowX/electron-music 中文歌曲 英文歌曲(如果有翻译的中文给回返回出去) 韩文歌曲 来看下 ...
- Linux soft lockup分析
关键词:watchdog.soft lockup.percpu thread.lockdep等. 近日遇到一个soft lockup问题,打印类似“[ 56.032356] NMI watchdog: ...
- (转)lwip TCP client & FreeRTOS 打开TCP 的 保活机制 LWIP_TCP_KEEPALIVE==1
参考大神教程:http://blog.sina.com.cn/s/blog_62a85b950101aw8x.html 老衲五木 :http://blog.sina.com.cn/s/blog_6 ...
- js 对日期处理
// 对Date的扩展,将 Date 转化为指定格式的String // 月(M).日(d).小时(h).分(m).秒(s).季度(q) 可以用 1-2 个占位符, // 年(y)可以用 1-4 个占 ...