scrollTop和offsetTop的区别:
scrollTop是指某个可滚动区块向下滚动的距离,比如向下滚动了10个像素,那么这个元素的scrollTop属性值就是10,这个属性的值是可读写的,且不需要设置position
offsetTop则是元素的上边框与父元素的上边框的绝对距离。

scrollLeft:设置或获取对象最左端和对象内容的最左端之间的距离,这个属性的值是可读写的
offsetLeft:获取对象相对于版面或由offsetParent属性指定的父坐标的左侧位置。

调用scrollLeft和scrollTop必须在父元素上,否则无效

taget.style.top 是作用于具体元素的,而不是作用于父元素,要想起作用必须设置position值

scrollTop和offsetTop的区别,scrollTopLeft和offsetLeft的区别的更多相关文章

  1. 花点时间搞清top、clientTop、scrollTop、offsetTop

    [转贴]花点时间搞清top.clientTop.scrollTop.offsetTop   scrollHeight: 获取对象的滚动高度. scrollLeft:设置或获取位于对象左边界和窗口中目前 ...

  2. js “top、clientTop、scrollTop、offsetTop…”

    当要做一些与位置相关的插件或效果的时候,像top.clientTop.scrollTop.offsetTop.scrollHeight.clientHeight.offsetParent...看到这么 ...

  3. js中的各种“位置”——“top、clientTop、scrollTop、offsetTop……”,你知道多少

    当要做一些与位置相关的插件或效果的时候,像top.clientTop.scrollTop.offsetTop.scrollHeight.clientHeight.offsetParent...看到这么 ...

  4. jQuery方法区别:click() bind() live() delegate()区别

    今天看到一篇jquery 事件的文章,自己写了个小例子,虽然2种方式都可以实现,但是不太明白,找了点资料 $("#box1").delegate("p",&qu ...

  5. JAVA基础之——三大特征、接口和抽象类区别、重载和重写区别、==和equals区别、JAVA自动装箱和拆箱

    1 java三大特征 1)封装:即class,把一类实体定义成类,该类有变量和方法. 2)继承:从已有的父类中派生出子类,子类实现父类的抽象方法. 3)多态:通过父类对象可以引用不同的子类,从而实现不 ...

  6. & 和 && 区别和联系,| 和 || 区别和联系

    & 和 && 区别和联系,| 和 || 区别和联系,实际项目中,什么情况用哪种? 首先,& 和 && 的联系(共同点): & 和 &&a ...

  7. js中top、clientTop、scrollTop、offsetTop的区别 文字详细说明版【转】

    之前在修改IE6下的一个显示bug时,查到过这些,贴这备忘,后面给出了详细说明,以前的版本,没仔细的说明,特希望大家也收藏下.   网页可见区域宽: document.body.clientWidth ...

  8. javascript中scrollTop和offsetTop的区别

    scrollTop是指某个可滚动区块向下滚动的距离,offsetTop则是元素的上边框与父元素的上边框的绝对距离. 1.offsetTop   : 当前对象到其上级层顶部的距离. 不能对其进行赋值.设 ...

  9. js中top、clientTop、scrollTop、offsetTop的区别 文字详细说明版

    网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;网页可见区域宽: document.body.offset ...

随机推荐

  1. Python基础-day2

    1.Python模块python 中导入模块使用import语法格式:import module_name示例1: 导入os模块system('dir')列出当前目录下的所有文件 # _*_ codi ...

  2. python可分组字典

    # -*- encoding: UTF-8 -*- from collections import defaultdict class News(object): def __init__(self, ...

  3. PCI在linux系统中注册与注销示例

    1. pci_driver结构struct pci_driver {    struct list_head node;    const char *name;    const struct pc ...

  4. copy-paste component

    http://www.cnblogs.com/wantnon/p/4579008.html

  5. win10输入法切换快捷键怎么设置

    win10输入法切换快捷键怎么修改?以前都是习惯使用(Ctrl+Shift) 现在新版的Win10默认的是[Shift+Alt]那要怎么把它改回来呢? http://jingyan.baidu.com ...

  6. 升级Flash Builder 4.6中的Flash Player版本

    测试有效 本人按此方法升级到了flash player 15 Adobe自发布Flash Builder 4.6后,就暂停了Flash Builder新版本的发布.但AIR和FlashPlayer版本 ...

  7. tiny6410在I2c用户态中的程序设计eeprom

    在读写的过程中,发现写数据成功但是读取数据却失败,猜测是因为iic的读写操作过快,故在写操作后给一定的延迟,进而读写成功. 代码如下: #include <stdio.h>#include ...

  8. [转]关于vs调试正确。但是发布到iis就出现无法访问后天局面

    最近使用extjs+ashx进行ajax请求过程操作的时候发现一个问题..当我把程序发布到iis的时候就出现一只不执行到success回调函数. 当弹出状态值一看尽然是500.我就纳闷了.又没有语法错 ...

  9. Javascript Window的属性

    Window的属性 属性 描述 closed 获取引用窗口是否已关闭. defaultStatus 设置或获取要在窗口底部的状态栏上显示的缺省信息. dialogArguments 设置或获取传递给模 ...

  10. Oracle Delete inner的方式,级联删除子表的数据方式。

    例子1: from table2 b where a.id=b.id) 例子2: rebatepolicy表是主表,rebatepolicyitems是从表,从表有主表的主键,现在对于主表一些条件的数 ...