有两个值一个是：scrollTop一个是scrollLeft
第一个代表页面利用滚动条滚动到下方时，隐藏在滚动条上方的页面的高度；
第二个代表页面利用滚动条滚动到右侧时，隐藏在滚动条左侧的页面的宽度

document.body.scrollLeft

document.body.scrollTop

2.如果父的overflow没有hidden的话，那么此父的scrollLeft一直为0.

offsetWidth与scrollLeft的更多相关文章

  1. 完全图解scrollLeft,scrollWidth,clientWidth,offsetWidth 获取相对途径，滚动图片(网上找的,未经试验,但觉得比较好)

    获取元素的位置属性可以通过 HTMLElement.offsetLeft HTMLElement.offsetTop 但是,这两个属性所储存的数值并不是该元素相对整个浏览器画布的绝对位置,而是相对于其 ...

  2. scrollLeft的相关问题（js横向无缝滚动）

    <div id="demo"> <div id="innerdemo"> <div id="demo1"> ...

  3. marquee实现文字移动效果;js+div实现文字无缝移动效果

    1.marquee实现文字移动: <marquee width="220px;" scrollamount="5" onmouseover="t ...

  4. js 无缝滚动效果学习

    <!DOCTYPE html> <html> <head> <title>无缝滚动测试</title> <meta http-equi ...

  5. 【吉光片羽】js横向滚动与浮动导航

    1.横向滚动,这个方法是见过最简洁的了. #demo { background: #FFF; overflow: hidden; border: 1px dashed #CCC; width: 117 ...

  6. div+css兼容 ie6_ie7_ie8_ie9_ie10和FireFox_Chrome等浏览器方法

    1.div的垂直居中问题 vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了.缺点是要控制内容不要换行   ...

  7. css 图片的无缝滚动

    转载:http://blog.sina.com.cn/s/blog_6387e82401013kx8.html js的图片的横向或者竖向的无缝滚动图片. ttp://zx.bjmylike.com/ ...

  8. 两种html幻灯片效果

    650) this.width=650;" src="http://img1.51cto.com/attachment/201307/165757318.jpg" tit ...

  9. marquee滚动语法

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

随机推荐

  1. Linux系统搭建LAMP平台

    知识背景(来自:百度百科): LAMP指的Linux(操作系统).Apache HTTP 服务器,MySQL(有时也指MariaDB,数据库软件) 和PHP(有时也是指Perl或Python) 的第一 ...

  2. #include <NOIP2009 Junior> 细胞分裂 ——using namespace wxl;

    题目描述 Hanks 博士是 BT (Bio-Tech,生物技术) 领域的知名专家.现在,他正在为一个细胞实 验做准备工作:培养细胞样本. Hanks 博士手里现在有 N 种细胞,编号从 1~N,一个 ...

  3. 【温故而知新-Javascript】对象

    1 创建对象 Javascript 支持对象的概率.有多种方法可以用来创建对象. <!DOCTYPE html> <html lang="en"> < ...

  4. 【Ext.Net学习笔记】03：Ext.Net DirectEvents用法详解、DirectMethods用法详解

    Ext.Net通过DirectEvents进行服务器端异步的事件处理.[Ext.Net学习笔记]02:Ext.Net用法概览.Ext.Net MessageBus用法.Ext.Net布局 中已经简单的 ...

  5. css3的媒体查询(Media Queries)

    我今天就总结一下响应式设计的核心CSS技术Media(媒体查询器)的用法. 先看一个简单的例子: <link rel="stylesheet" media="scr ...

  6. RabbitMQ - 实例操作

    以前在单项目中用过RabbitMQ,没有问题 不过这次在分布式项目中使用RabbitMQ中有点搞糊涂了,但是实际上是没有问题的,思路清晰就行 简单看一下实际操作的示例吧: 资源文件中需要配置基本的ra ...

  7. 并发用户数与TPS之间的关系

    1.  背景 在做性能测试的时候,很多人都用并发用户数来衡量系统的性能,觉得系统能支撑的并发用户数越多,系统的性能就越好:对TPS不是非常理解,也根本不知道它们之间的关系,因此非常有必要进行解释. 2 ...

  8. [ORACLE错误］oracle 不能更新 PL/SQL 点击“edit data”报“ these query results are not updateable”

    你可以选择在查询语句的最后加上 for update,就可以打开编辑锁,直接修改数据. 而在默认查询下,点击Edit data,会报错:The query results are not update ...

  9. JMeter学习（十四）JMeter监控Tomcat性能

    使用jmeter的tomcat监视器功能,可以通过向tomcat的status页面发送get请求,得到资源使用信息,然后转换为只直观的图像方式,这样的话,就可以监视到服务器的资源使用情况,不过需要注意 ...

  10. AndroidStudio .gitinore编写

    # Built application files *.apk *.ap_ # files for the dex VM *.dex # Java class files *.class */R.ja ...