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. 【题解】DZY Loves Chinese

    [题解]DZY Loves Chinese II 不吐槽这题面了... 考虑如何维护图的连通性,如果把图的变成一颗的\(dfs\)生成树,那么如果把一个节点的父边和他接下来所有的返祖边删除,那么我们就 ...

  2. 警告: [SetPropertiesRule]{Server/Service/Engine/Host/Context} Setting property 'source' to 'org.eclipse.jst.jee.server:Zhuo' did not find a matching property.

    eclipse里面配置tomcat方法:window -- show view -- other -- 找到servers 点击finish 就会出现servers选项卡在选项卡中右键鼠标 new - ...

  3. JSDuck 安装---mac

    1.  如果你已经安装了xcode,安装Xcode command line tools,在终端输入 xcode-select --install 2.install RVM \curl -sSL h ...

  4. 取得微信用户OpenID

    公司需要微信这个平台和用户交流,于是开始研究微信公众平台.微信公众平台分为两种模式,其一是编辑模式,比如用户发什么内容,你可以响应什么内容.另外一种便是开发模式,这个模式功能丰富,不仅仅可以获取到用户 ...

  5. 51Nod 1158 全是1的最大子矩阵 —— 预处理 + 暴力枚举 or 单调栈

    题目链接:http://www.51nod.com/onlineJudge/questionCode.html#!problemId=1158 1158 全是1的最大子矩阵  基准时间限制:1 秒 空 ...

  6. ActiveMQ持久化机制

    用户注册成功后发短信提醒 同步http 异步mq JMS中两种通讯模式: 发布订阅   一对多  topic   去过消费者集群的话 都会消费 消息队列   点对点 queue  去过消费者集群的话 ...

  7. 分享知识-快乐自己：Oracle SQL语法汇总

    --删除重复值-保留重复值最大的编号 delete from emp where rowid in( select rowid from emp where rowid not in( select ...

  8. PowerDesigner根据SQL文件生成PDM数据字典

    当PowerDesigner不能直接连接到数据库的时候,可以用到下面这个方法生成数据字典(直接连接数据库生成数据字典在上次随笔中有介绍). 具体操作步骤截图: ↓↓↓这里选择的sql文件是从数据库导出 ...

  9. 设置可见GPU方式

    只可见第一块GPU os.environ["CUDA_VISIBLE_DEVICES"] = "0"

  10. 数据结构与算法（5）----->二叉树

    1.  概念 二叉树节点的结构: class Node{ int value; // value表示二叉树的节点值 Node left; Node right; // left和right表示二叉树的 ...