client/scroll/offset width/height/top/left (盒模型为contentBox，定位原点是元素左上角边框最外层的交点)

clientWidth  width+左padding+右padding(如果有竖滚动条，那么要减去17px)
        clientHeight height+上padding+下padding(如果有横滚动条，那么要减去17px)
        clientTop   border-top-width上边框宽度
        clientLeft border-left-width 左边框宽度
        offsetHeight 同下
        offsetWidth  borderLeftWidth + paddingLeft + width + paddingRight + borderRightWidth
        offsetLeft  当前元素原点相对于定位父元素左上角边框最内层交点的左偏移量
        offsetTop    当前元素原点相对于定位父元素左上角边框最内层焦点的上偏移量
        offsetParent 相对于偏移的父元素
        scrollHeight  
            如果元素无竖滚动条，paddingLeft + width + paddingRight.
            如果有竖滚动条，那么和内容占用的宽度有关，具体怎么算的还没搞清楚。
        scrollWidth  
            类似上面
        scrollLeft 横滚动条滚过的长度
        scrollTop  竖滚动条滚过的长度

client/scroll/offset width/height/top/left ---记第一篇博客的更多相关文章

  1. offset[Parent/Width/Height/Top/Left] 、 client[Width/Height/Top/Left] 、 Element.getBoundingClientRect()

    开篇提示:以下内容都经个人测试,参考API文档总结,但还是不能保证完全正确,若有错误,还请留言指出___________________________________________________ ...

  2. 解决编译apache出现的问题：configure: error: APR not found . Please read the documentation - ____哊.時^随记 - 51CTO技术博客

    解决编译apache出现的问题:configure: error: APR not found . Please read the documentation - ____哊.時^随记 - 51CTO ...

  3. 编程道拓扑bcd.top 0x01/ 开局第一篇： 随便聊聊/ 随笔

    0x01 开局 编程道拓扑(bcd.top)是一个前端从业者的思考和总结, 如果你喜欢, 欢迎关注! 作者是一个前端从业者, 本系列会总结作者在工作和学习中的一些思考, 会有具体的技术点, 也会有关于 ...

  4. 关于” 记一次logback传输日志到logstash根据自定义设置动态创建ElasticSearch索引” 这篇博客相关的优化采坑记录

    之前写过一篇博客是关于记录日志的简单方式的   主要就是  应用->redis->logstash->elasticsearch 整个流程的配置方法和过程的 虽然我们部分线上应用使用 ...

  5. eclipse弃坑记第一篇之在idea上配置Tomcat环境并创建Javaweb项目的详细步骤原创

    IntelliJ IDEA是一款功能强大的开发工具,在代码自动提示.重构.J2EE支持.各类版本工具(如git.svn.github).maven等方面都有很好的应用. IntelliJ IDEA有免 ...

  6. Android应用开发-小巫CSDN博客client之嵌入有米广告

    Android应用开发-小巫CSDN博客client之嵌入有米广告 上一篇博客给大家介绍怎样集成友盟社会化组件,本篇继续带来干货,教大家怎样嵌入广告到应用中去.小巫自称专业对接30年,熟悉各大渠道SD ...

  7. 前端 ---client、offset、scroll系列

    client.offset.scroll系列   1.client系列 代码如下: <!DOCTYPE html> <html> <head> <meta c ...

  8. python 全栈开发，Day52(关于DOM操作的相关案例,JS中的面向对象,定时器,BOM,client、offset、scroll系列)

    昨日作业讲解: 京东购物车 京东购物车效果: 实现原理: 用2个盒子,就可以完整效果. 先让上面的小盒子向下移动1px,此时就出现了压盖效果.小盒子设置z-index压盖大盒子,将小盒子的下边框去掉, ...

  9. 4.client、offset、scroll系列

    client.offset.scroll系列 他们的作用主要与计算盒模型.盒子的偏移量和滚动有关 clientTop 内容区域到边框顶部的距离 ,说白了,就是边框的高度 clientLeft 内容区域 ...

随机推荐

  1. 开发ERP软件应该遵守的22条规则

    总结一下做管理软件,有哪些项是经过检验的条款,必须遵守的. 界面篇 1  要保存用户的偏号(profile/favourite). ASP.NET 2.0引入此功能,当用户修改默认的控件的属性时,框架 ...

  2. [推荐]WebService开发知识介绍

    [推荐]WebService开发知识介绍 WebService开发手册  http://wenku.baidu.com/view/df3992ce050876323112128a.html WebSe ...

  3. 如何使用代码动态的获取和设置ImageView的宽度和高度？

    http://blog.csdn.net/wulianghuan/article/details/8644144 国内某金融企业的一道面试题:如何在代码中获得一个ImageVIew的高度和宽度? 相信 ...

  4. 多层嵌套对象无法使用gson反序列化的问题The JsonDeserializer com.google.gson.DefaultTypeAdapters$CollectionTypeAdapter@3bf13cde failed to de

    http://www.oschina.net/question/1256646_123691 http://bbs.csdn.net/topics/360005140 http://stackover ...

  5. 一个优秀windows C++程序员的知识体系

    思考一个优秀windows C++ 程序员该有哪些知识,可最终发现什么知识都不能少, 看下图: 除了上面知识,程序员还要不断学习, 保持对新知识的热情. 转自http://www.cppblog.co ...

  6. Android UI系列-----EditText和AutoCompleteTextView

    在这篇随笔里将主要讲解一下EditText和AutoCompleteTextView这个控件 1.EditText 首先我们先简单来说说EditText这个控件,这个就相当于我们平常web开发中的文本 ...

  7. HDU 3844 Mining Your Own Business

    首先,如果图本来就是一个点双联通的(即不存在割点),那么从这个图中选出任意两个点就OK了. 如果这个图存在割点,那么我们把割点拿掉后图就会变得支离破碎了.对于那种只和一个割点相连的块,这个块中至少要选 ...

  8. AWVS漏洞测试-02节-添加一个简单的新闻系统

    实现一个简单的新闻发布系统 有登录 注册 添加新闻 浏览新闻 评论新闻 新闻列表 这些基本功能 使用asp.net webform 首先是登录页 protected void Button1_Clic ...

  9. Windows 2008 利用Filezilla server搭建FTP

    Windows 2008 利用Filezilla server搭建FTP, 安装后总是提示Error Connection To Server Lost , 后来,无意中先安装了IIS,再安装file ...

  10. C#-DataTable分页代码

    /// <summary> /// DataTable分页并取出指定页码的数据 /// </summary> /// <param name="dtAll&qu ...