尺寸操作
1、获取宽高
     a) jq对象.height/width () :只有获取高度/宽度
        尺寸,不包括padding和margin 和 border
2、设置宽度
   a) Jq对象 . height/ width("200px");
   b) px可加可不加,不加不需要写双引号
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()
}); })
 
坐标值操作
1、offset(). left /top 获取该对象距离页面顶端 左边的距离
 //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的更多相关文章

  1. 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 ...

  2. offset() position() scrollTop() scrollLeft()

    (1)offset:获取当前元素相对于文档的高度.只对可见元素有效. 不管该元素如何定位,也不管其父元素如何定位,都是获取的该元素相对于当前视口的偏移 (2) position:获取元素相对于最近的一 ...

  3. javascript中常用坐标属性offset、scroll、client

    原文:javascript中常用坐标属性offset.scroll.client 今天在学习js的时候觉得这个问题比较容易搞混,所以自己画了一个简单的图,并且用js控制台里面输出测试了下,便于理解. ...

  4. CSS属性之position讲解

    postion 属性定义了一个元素在页面布局中的位置以及对周围元素的影响.该属性共有5个值: position: static position: inherit position: relative ...

  5. CALayer属性:position和anchorPoint

    一.position和anchorPoint 1.简单介绍 CALayer有2个非常重要的属性:position和anchorPoint @property CGPoint position; 用来设 ...

  6. 系列属性(offset、scroll、client)

    一.offset系列属性 <div id="dv"></div> <!-- 已在style标签里设置div宽高各100px --> <sc ...

  7. js中的offsetParent,offsetLeft,offsetTop及jquery的offset(),position()比较

    1.offsetParent 元素的offsetParent并不是元素的父元素,判断元素的offsetParent要根据以下情况: 1)当DOM结构层次中的元素均没有进行css定位(设置positio ...

  8. ☀【offset() / position()】

    <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="utf-8& ...

  9. 关于css float 属性以及position:absolute 的区别。

    1.float 属性定义元素在哪个方向浮动.以往这个属性总应用于图像,使文本围绕在图像周围,不过在 CSS 中,任何元素都可以浮动.浮动元素会生成一个块级框,而不论它本身是何种元素.div一个典型的块 ...

随机推荐

  1. Thymeleaf 模板使用 Error resolving template "/home", template might not exist or might not be accessible by any of the

    和属性文件中thymeleaf模板的配置相关 1.配置信息 spring.thymeleaf.prefix=classpath:/templates/ spring.thymeleaf.suffix= ...

  2. B+Tree的基本介绍

    概念 特点 B-Tree有许多变种,其中最常见的是B+Tree,例如MySQL就普遍使用B+Tree实现其索引结构. 与B-Tree相比,B+Tree有以下不同点: 每个节点的指针上限为2d而不是2d ...

  3. C# EF & linq 常用操作

    一.EF的左连接 在EF中,当在dbset使用join关联多表查询时,连接查询的表如果没有建立相应的外键关系时,EF生成的SQL语句是inner join(内联),对于inner join,有所了解的 ...

  4. 开发环境,不用每次都ant自动编译

    公司所用ant技术,每次改个java文件,配置文件都需要重新编译一次发布 在实际搭环境的过程发现,ant就是把项目目录下的文件编译成功后的搬移到到 ,Tomcat 运行环境配置的目录下,凡是修改的文件 ...

  5. 1、java集合:java集合详解及类关系图

    List和Set继承自Collection接口. Set无序不允许元素重复.HashSet和TreeSet是两个主要的实现类. List有序且允许元素重复,支持null对象.ArrayList.Lin ...

  6. SVN 问题解决之 The XML response contains invalid XML

    公司几个同事的SVN更新时出现了The XML response contains invalid XML报错 经Google得到一个线索,可能和Http请求有关. 想起之前项目改过一次网络请求方式, ...

  7. fcrackzip破解zip密码

    kail系统里有fcrackzip工具,可以对设置密码的压缩包zip直接进行破解,不用字典,直接进行暴力破解. fcrackzip 所用到的参数介绍如下:-b 表示暴力破解-c 表示暴力破解中使用的字 ...

  8. 【Day5】2.反爬策略之代理IP

    import urllib.request as ur proxy_address = ur.urlopen('http://api.ip.data5u.com/dynamic/get.html?or ...

  9. 《形式化分析工具Scyther性能研究》------摘抄整理

    本篇论文的主要创新点在--------使用 Scyther工具发现对部分 KCI攻击搜索出现漏报的现象,并给出了存在的原因, 介绍了 形式化分析工具   AVispa全称是   Automated V ...

  10. PAT Basic 1074 宇宙无敌加法器 (20 分)

    地球人习惯使用十进制数,并且默认一个数字的每一位都是十进制的.而在 PAT 星人开挂的世界里,每个数字的每一位都是不同进制的,这种神奇的数字称为“PAT数”.每个 PAT 星人都必须熟记各位数字的进制 ...