jquer属性 offset、position、scrollTop
jQuery(function(){
//获取宽度
$("button").eq().click(function(){
和js offsetWidth 不一样
alert( $("div").width())
}); //设置宽度
$("button").eq().click(function(){
$("div").width()
}) //获取高度
$("button").eq().click(function(){
alert( $("div").width())
}); //设置高度
$("button").eq().click(function(){
$("div").width()
}); })
//offset().top 获取对象距离页面顶部/左边的距离 和定位没关系
$("button").eq().click(function(){
alert($(".box2").offset().top)
}); // 无用,只能获取值 不能赋值
$("button").eq().click(function(){
$(".box2").offset().top=
})
}
2、position(). left/top 距离最近的定位父级元素的上边距 左边距
//position().top 距离定位的父盒子上边距 / 左边距
// 不包含margin padding 就的定位的距离
$("button").eq().click(function(){
alert($(".box2").position().top)
});
3、scrollTop/left 被卷曲的头部高度
<span data-wiz-span="data-wiz-span" style="font-size: 1.167rem;"></span>
$("button").eq().click(function(){ alert($(".box1").scrollTop()) }) //获取头部卷上去的高度
<span data-wiz-span="data-wiz-span" style="font-size: 1.167rem;"></span>
//复制,让滚动到指定的位置
$("button").eq().click(function(){ $(document).scrollTop() })
jquer属性 offset、position、scrollTop的更多相关文章
- pageX/Y, offset(), position(), scrollTop(), screenX/Y, clientX/Y, pageX/Y
event.pageX get mouse position Description: The mouse position relative to the left edge of the docu ...
- offset() position() scrollTop() scrollLeft()
(1)offset:获取当前元素相对于文档的高度.只对可见元素有效. 不管该元素如何定位,也不管其父元素如何定位,都是获取的该元素相对于当前视口的偏移 (2) position:获取元素相对于最近的一 ...
- javascript中常用坐标属性offset、scroll、client
原文:javascript中常用坐标属性offset.scroll.client 今天在学习js的时候觉得这个问题比较容易搞混,所以自己画了一个简单的图,并且用js控制台里面输出测试了下,便于理解. ...
- CSS属性之position讲解
postion 属性定义了一个元素在页面布局中的位置以及对周围元素的影响.该属性共有5个值: position: static position: inherit position: relative ...
- CALayer属性:position和anchorPoint
一.position和anchorPoint 1.简单介绍 CALayer有2个非常重要的属性:position和anchorPoint @property CGPoint position; 用来设 ...
- 系列属性(offset、scroll、client)
一.offset系列属性 <div id="dv"></div> <!-- 已在style标签里设置div宽高各100px --> <sc ...
- js中的offsetParent,offsetLeft,offsetTop及jquery的offset(),position()比较
1.offsetParent 元素的offsetParent并不是元素的父元素,判断元素的offsetParent要根据以下情况: 1)当DOM结构层次中的元素均没有进行css定位(设置positio ...
- ☀【offset() / position()】
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8& ...
- 关于css float 属性以及position:absolute 的区别。
1.float 属性定义元素在哪个方向浮动.以往这个属性总应用于图像,使文本围绕在图像周围,不过在 CSS 中,任何元素都可以浮动.浮动元素会生成一个块级框,而不论它本身是何种元素.div一个典型的块 ...
随机推荐
- (六)Struts的简单异常处理
一.异常的分类 1.1 struts中的异常概念 Struts的声明式异常: 不处理异常,将异常交给struts框架来处理. 1.2 局部异常 局部异常:异常定义在Action里,异常处理只在这个Ac ...
- mysql cmd命令行 创建数据库 表 基础语句
一.连接MYSQL 格式: mysql -h主机地址 -u用户名 -p用户密码 1. 连接到本机上的MYSQL. 首先打开DOS窗口,然后进入目录mysql\bin,再键入命令mysql -u roo ...
- Trie树(字典树)-题解 P2580 【于是他错误的点名开始了】
此题可以用STL中的map做,但是了解一下Trie树这个数据结构也是必须的. Trie树(又称字典树)有以下特点: 根节点不包含字符,除它之外的每一个节点都包含一个字符. 从根节点到某一节点,路径上经 ...
- Django rest-framework框架-组件之渲染器
渲染器: from rest_framework.renderers import BrowsableAPIRenderer,AdminRenderer,HTMLFormRenderer,JSONRe ...
- JoinableQueue类与线程
生产者消费者的问题及其解决办法 问题 在之前的生产者消费者模型中,生产者和消费者只有一个, 那么生产者往队列里put几次,消费者就get几次,但是存在一个问题, 生产者不一定只有一个,消费者也不一定只 ...
- Oracle查看表之间的约束
----查看表约束 表格: user_constraints 查询外键约束条件 select ' select count(*) from '||TABLE_NAME||';'from user_co ...
- XML文件解析之SAX解析
使用DOM解析的时候是需要把文档的所有内容读入内存然后建立一个DOM树结构,然后通过DOM提供的接口来实现XML文件的解析,如果文件比较小的时候肯定是很方便的.但是如果是XML文件很大的话,那么这种方 ...
- springmvc模式下的上传和下载
接触了springmvc模式后,对上一次的上传与下载进行优化, 上次请看这里. 此处上传的功能依旧是采用表格上传.文件格式依旧是 <form action="${pageContext ...
- 警告信息-Comparing unrelated types
解决方案 使用equals 来比较不相关的类和接口
- 远程连接服务器数据库报错:Host ‘XXXXXX’ is blocked because of many connection errors
原文:https://blog.csdn.net/li_li_lin/article/details/72764683 一.我遇到的问题描述 使用Navicat for mysql连接公司的服务器数据 ...