window.addEventListener('scroll',function(){
if(document.compatMode == "CSS1Compat") {
alert(document.documentElement.scrollTop);
} else {
alert(document.body.scrollTop);
}
},false);

虽然scroll事件是在window对象上发生的,但它事件表示的则是页面中相应元素的变化。在混杂模式中,可以通过<body>元素的scrollLeft和scrollTop来监控这一变化;在标准模式下,除Safari之外的所有浏览器都会通过<html>元素来反映这一变化(Safari还是基于<body>跟踪位置);

以上代码指定的事件处理程序会输出页面的垂直滚动位置——根据呈现模式不同使用了不同的元素。由于Safari3.1之前的版本不支持document.compatMode,因此旧版本就会满足第二个条件。

javascript中的scroll事件的更多相关文章

  1. 在javascript中如何取消事件冒泡

    如果在javascript中只希望事件发生在它的目标而不是在它的父元素上,即取消它的冒泡事件的发生,该如何做?因为按照javascript发生事件的顺序,它由两个阶段:分别从根元素--父元素--目标元 ...

  2. JavaScript中常用的事件

    .onclick事件 点击事件(onclick并不是js中的方法,onclick只是浏览器提供js的一个dom接口,让js可以操作dom,所以onclick大小写都是没问题的,比如HTML代码就不用区 ...

  3. JavaScript中冒泡与事件委托

    冒泡 事件触发后事件流的三个阶段按顺序依次是: 1.捕获阶段 2.目标阶段 3.冒泡阶段 大盒子包裹小盒子,两个盒子都分别添加点击事件,当点击小盒子,两个盒子的事件都会触发. 事件委托 下级元素委托上 ...

  4. JavaScript中的方法事件和函数的方法的三种方法

    js中的很多事件  而事件相对应的就是方法(函数 )那么今天所说的就是这三种方法      已onclick事件为例 1: 基本方法 <div id="a" onclick= ...

  5. javascript中window.event事件用法详解

    转自http://www.jb51.net/article/32564.htm描述 event代表事件的状态,例如触发event对象的元素.鼠标的位置及状态.按下的键等等. event对象只在事件发生 ...

  6. JavaScript中的ononline事件和onoffline事件

    关于这个时间的描述到处都有,但基本上都是说离线在线什么的我一下子还没反应过来.后再在这里看到了一句话:"断开网络再联网试试,就可以看到连线的提示."这才反应过来,原来指的是网络状态 ...

  7. JavaScript中的定时事件

    这两个函数都是在给定的时间之后开始执行的,并不是立即执行. var timeId = window.setTimeout("method()",1000); //定时执行,还可以这 ...

  8. Javascript中与Scroll有关的方法

    这块确实太乱了,被兼容搞的简直快要晕死,默默地总结下... 与scroll相关的方法 4个window对象下:scrollX.scrollY.scrollTo.scroll(作用和scrollTo一样 ...

  9. 记录JavaScript中使用keyup事件做输入验证(附event.keyCode表)

    input的blur事件 $("#input-name").blur(function () { var value = $(this).val(); if (value === ...

随机推荐

  1. 【题解】P2048 [NOI2010]超级钢琴

    [题解][P2048 NOI2010]超级钢琴 一道非常套路的题目.是堆的套路题. 考虑前缀和,我们要是确定了左端点,就只需要在右端区间查询最大的那个加进来就好了.\(sum_j-sum_{i-1}​ ...

  2. git版本控制-- Windows+Git+TortoiseGit+COPSSH安装图文教程

    Windows+Git+TortoiseGit+COPSSH 安装图文教程 教程网址: http://www.liaoxuefeng.com/wiki/0013739516305929606dd183 ...

  3. python仪表盘

    1.在这里可以看到pyecharts中有定义好的各种图标类. 复制上面代码,会出现“ModuleNotFoundError: No module named 'pyecharts'”. pip ins ...

  4. 深刻理解render 和 redirect_to

    深刻理解render 和 redirect_to http://www.blogjava.net/fl1429/archive/2009/03/12/259403.html 由于最近老是在表单提交后出 ...

  5. oracle_sql的用法?

    本机连接oracle 数据库?打开cmd ----> 不同的用户有不同的用户名密码 ----> sqlplus scott/tiger(安装oracle数据库预留的用户)---- 回车 - ...

  6. socket,获取html,webservice等,支持chunked,gzip,deflate

    1. [代码][C#]代码using System;using System.Collections.Generic;using System.Linq;using System.Net.Socket ...

  7. 安装与设置hexo

    普通用户(非全局)安装nodejs和npm wget -qO- https://raw.github.com/creationix/nvm/master/install.sh | sh nvm ins ...

  8. python学习笔记:第八天(模块)

    Python3 模块 脚本上是用 python 解释器来编程,如果从 Python 解释器退出再进入,那么定义的所有的方法和变量就都消失了. 为此 Python 提供了一个办法,把这些定义存放在文件中 ...

  9. Git_学习_04_ 多人协作开发的过程

    多人协作的工作模式通常是这样: 1.首先,可以试图用 git push origin branch-name 推送自己的修改: 2.如果推送失败,则因为远程分支比你的本地更新,需要先用 git pul ...

  10. hdu-5826 physics(数学)

    题目链接: physics Time Limit: 6000/3000 MS (Java/Others)     Memory Limit: 65536/65536 K (Java/Others) P ...