有两个值一个是：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. 图片延迟加载（lazyload）的实现原理

    此前在浏览一些网站的时候,发现他们网站的图片都是你“鼠标”滚到哪,图片才会加载显示.当时觉得好神奇,怎么会这么“跟手”呢. 核心原理是: 1 设置一个定时器,计算每张图片是否会随着滚动条的滚动,而出现 ...

  2. Android Listener侦听的N种写法

    Android中,View的Listener方法,在是否使用匿名类匿名对象时,有各种不同的写法. OnClickListener和其他Listener方法一样,都是View类的接口,重载实现后就能使用 ...

  3. R语言与数据分析

    K最近邻(k-Nearest Neighbor,KNN)分类算法 R语言实现包:R语言中有kknn package实现了weighted k-nearest neighbor. 决策树: R语言实现决 ...

  4. 在EntityFramework6中执行SQL语句

    在EntityFramework6中执行SQL语句 在上一节中我介绍了如何使用EF6对数据库实现CRDU以及事务,我们没有写一句SQL就完成了所有操作.这一节我来介绍一下如何使用在EF6中执行SQL语 ...

  5. TFSF边界条件

    待续 %1D FDTD simulation with a simple absorbing boundary condition % and a TFSF boundary between hy[] ...

  6. easyui 的 DataGrid View 使用

    easyui真是后台人员的宝呀,让不会前台的程序员,不用再用那些自己看着都恶心的表格了! 今天来说说easyui datagrid 的 数据表格详细展示表格,这个有趣多了! 先上图 然后是代码 $(' ...

  7. java 15 - 8 集合框架（并发修改异常的产生原因以及解决方案）

    问题?   我有一个集合,如下,请问,我想判断里面有没有"world"这个元素,如果有,我就添加一个"javaee"元素,请写代码实现.  面试题: Concu ...

  8. 17Spring_AOP编程(AspectJ)_AspectJ的注解编程

    前面的各种Aop编程,都是基于XML的,这篇文章讲的是把XML方式改为注解方式来做. Spring注解开发和xml开发所需要的包是一样的,所以只要把xml开发方式的包复制到以注解为开发方式的包的项目下 ...

  9. 如何将NTFS格式的移动硬盘挂接到Mac OS上进行读写（Read/Write）操作

    现在硬盘便宜,很多同学都有移动硬盘,如果你同时使用Windows与Mac OS的话,移动硬盘最好不要使用NTFS文件系统,否则在Mac OS上,你只能读你的移动硬盘,不能写. 但是实际上的情况是,移动 ...

  10. HAXM cannot be installed nutil TV-x is enabled

    提示错误:如图 HAXM cannot be installed nutil TV-x is enabled 问题原因: 电脑没有启动Intel的虚拟化技术 解决方法: 重启电脑,进BIOS中启动VT ...