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一个典型的块 ...
随机推荐
- .net core partial view的一些心得
原文:.net core partial view的一些心得 版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接:https://blog. ...
- Vs2019 C# .net core 将证书添加到受信任的根证书存储失败,出现以下错误:访问控制列表(ACL)结构无效
https://www.cnblogs.com/xiyuan/p/10632579.html 使用 vs2017 创建一个 ASP.NET Core Web 应用程序 -> Ctrl + F5 ...
- JDBC 学习复习9 配置Tomcat数据源
在实际开发中,我们有时候还会使用服务器提供给我们的数据库连接池,比如我们希望Tomcat服务器在启动的时候可以帮我们创建一个数据库连接池,那么我们在应用程序中就不需要手动去创建数据库连接池,直接使用T ...
- 关于ECharts甘特图的实现
对于使用ECharts图表的步骤,每种图表都是一致的,相信大家也都了解 此处只分享甘特图的option,代码如下: option: { title: { text: '项目实施进度表', left: ...
- 关于Objective C的私有函数
(1)很多从其他语言(例如C++)转到objective c的初学者,往往会问到一个问题,如何定义类的私有函数?这里的“私有函数”指的是,某个函数只能在类的内部使用,不能在类的外部,或者派生类内部使用 ...
- css-两个div并排,左边宽度固定右边自适应的布局 的实现方法
<div class= "container"> <div class="left"></div> <div clas ...
- spider _其他库的简单操作与方法
PHP : 网络IO java : 代码笨重,代码量很大 C/C++ :虽然效率高,但是代码成型很慢 1 通用网络爬虫(搜索引擎引用,需要遵守robots协议) 1 搜索引擎如何获取一个新网站的 UR ...
- JS 详解 Cookie、 LocalStorage 与 SessionStorage-转载
记录一下这些知识,有时候用到会忘记,对原文作者表达感谢. 附上原文链接:JS 详解 Cookie. LocalStorage 与 SessionStorage 基本概念 Cookie Cookie 是 ...
- 最最常用的RAID
若转载请于明显处标明出处:http://www.cnblogs.com/kelamoyujuzhen/p/8980696.html RAID stands for Redundant Array of ...
- 10_Azkaban案例实践3_Command操作HDFS
HDFS操作任务 1.创建job描述文件 # fs.job type=command command=/usr/local/src/hadoop-2.6.4/bin/hadoop fs -mkdir ...