虽然我是做后台出身的,但最近心血来潮越来越关注前台技术了^_^,前二天看了“司徒正美”先生的图片无缝滚动分析后,对于scrollTop和offsetTop这二个以前一直没搞太明白的属性研究了一番,大致弄明白了,贴在这里备份,测试代码如下:
scrollTop与offsetTop研究<!doctype html>
scrollTop与offsetTop研究
<title>scrollTop study</title>
>

代码很简单,一个100px的正方形div,border边框值为15px,overflow设置为hidden(隐藏),然后里面放了二个100*60的子div,显然60*2=120px,大于最外层容器的100px高度,所以会有一部分被截掉,为了更形象,二个子div上面还放置了一行文字,高度为18px,点击按钮后,最下面绿色子div的scrollTop递增加1(即位置不断升高,直至完全呈现出来)

为方便理解,还画了一个分析图:(值得注意的是offsetTop属性在ie8的非兼容模式下,还要加上Border的高度)
scrollTop与offsetTop研究

相关文章:

  • 2022-12-23
  • 2022-12-23
  • 2021-11-29
  • 2021-11-26
  • 2021-09-29
  • 2022-12-23
  • 2021-07-27
猜你喜欢
  • 2021-11-21
  • 2021-06-26
  • 2022-12-23
  • 2022-12-23
  • 2021-07-11
  • 2021-07-11
  • 2022-02-19
相关资源
相似解决方案