在IE、FF、Chrome下scrollTop(或scrollLeft)的区别
来源:互联网 发布:南风知我意七微盘下载 编辑:程序博客网 时间:2024/05/17 23:35
在JavaScript中我们可以用document.body.scrollLeft设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离,如果你的页面使用了DTD标识,也就是html源代码中有:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
这样的代码的话则应该使用document.documentElement.scrollLeft,在IE和FireFox都是没有问题。
但是我测试Google的Chrome则发现在有DTD标识的页面中document.documentElement.scrollLeft一直为0,反到用document.body.scrollLeft可以获取正确的值.
所以……别纠结了,做个判断如果是Chrome下就乖乖的用body吧。
附注:
scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离 clientWidth:设置或获取网页可见区域宽 clientHeight:设置或获取网页可见区域高
- 在IE、FF、Chrome下scrollTop(或scrollLeft)的区别
- IE/FF/Chrome下document.documentElement和document.body的 scrollHeight/scrollTop/clientHeight 以及判断滚动条是否已拉
- IE/FF/Chrome下document.documentElement和document.body的 scrollHeight/scrollTop/clientHeight 以及判断滚动条是否已拉
- IE/FF/Chrome下document.documentElement/body的 scrollHeight/scrollTop/clientHeight 以及判断滚动条是否到达页面底部。
- IE/FF/Chrome下document.documentElement和document.body的 scrollHeight/scrollTop/clientHeight 以及判断滚动条是否已拉
- IE/FF/Chrome下document.documentElement和document.body的 scrollHeight/scrollTop/clientHeight 以及判断滚动条是否已拉
- IE、FF、Safari 等浏览器下scrollTop的差异
- 解决iframe的frameborder在chrome/ff/ie下的差异
- Servlet3异步asyncContext在IE(789)/chrome/ff下的差别表现(1)
- innerHTML在IE与FF、chrome、opera浏览下获取的HTML标称名大小写不一样
- scrollTop scrollLeft的封装
- webkit内核(chrome、safari) 、FF、IE 、opera 下的linear-gradient 写法
- offsetWidth clientWidth scrollWidth scrollTop scrollLeft等属性的细微区别
- 【转】ie/ff/chrome下的document.body和document.documentElement的区别以及滚动条滚动到底
- JavaScript拖拽(二):限制在客户区的拖拽(解决scrollLeft和scrollTop)
- 在ie和ff下文档height区别
- 学习div float 在ff和ie下的布局区别
- CS样式在FF和IE下的区别之处汇总
- 仅以此文献给2010年仍然单身的80后我们
- 今天的心情
- BW:COMPUTE_INT_TIMES_OVERFLOW:BW Statistics上载出错
- linux 命令 个人搜集版
- 字符串匹配:two-way算法
- 在IE、FF、Chrome下scrollTop(或scrollLeft)的区别
- flex,mxml中,text属性无法识别换行符/n的解决办法。
- ext学习笔记 2010-10-25 ext核心
- Spring v3.0.2 Learning Note 1 - Introduction to Spring Framework
- 在MyEclipse中debug使用手册
- 用layer-list一次加载多个层次图片
- 停车场模拟问题的分析思路,解决细节。加了关键注释。
- make menuconfig 执行出错ou must install ncurses-devel in order to use 'make menuconfig解决办法
- Mechanics of USB cable and connector