javascript中的scroll事件

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，因此旧版本就会满足第二个条件。

时间： 2024-11-05 20:40:19

javascript中的scroll事件的相关文章

JavaScript中常用的事件

转自:http://www.cnblogs.com/dtdxrk/p/3551454.html 作者:文刀日月 JavaScript中常用的事件 事件委托 可以给元素添加多个事件 var addHandler = function(element,type,handler){ if(element.addEventListener){ element.addEventListener(type,handler,false); //false表示冒泡阶段 }else if(element.atta

JavaScript中的Event事件对象详解

JavaScript事件[event] 在JavaScript中对于事件来讲,首先,我们需要了解这样几个概念:事件:事件处理程序:事件类型:事件流:事件冒泡:事件捕获:事件对象:浏览器内核:事件绑定:事件方面的性能优化(事件委托.移除事件处理程序):常见的浏览器兼容问题等. 什么是事件event: JavaScript事件是:浏览器.文档(document)窗口中的发生的特定的交互瞬间:而JavaScript和HTML之间的交互行为就是通过事件来触发的. 事件处理程序: 事件处理程序:我们用户在

解决JavaScript中批量添加事件的问题

这是JavaScript中一个老生常谈的问题,也是初学者较难理解的问题.当给一系列元素添加事件时,常常会出现一些我们不希望出现的问题.例如以下代码: //给li元素批量添加click事件 window.onload = function(){ var lists = document.getElementsByTagName("li"); for(var i=0;i<lists.length;i++){ lists[i].onclick = function(){ alert(i

javascript中常用的事件绑定方法

我们要想让 JavaScript 对用户的操作作出响应,首先要对 DOM 元素绑定事件处理函数.所谓事件处理函数,就是处理用户操作的函数,不同的操作对应不同的名称. 在JavaScript中,有三种常用的绑定事件的方法: 在DOM元素中直接绑定: 在JavaScript代码中绑定: 绑定事件监听函数. 一. 在DOM元素中直接绑定 这里的DOM元素,可以理解为HTML标签.JavaScript支持在标签中直接绑定事件,语法为:    onXXX="JavaScript Code" 其中

javascript中查看元素事件函数的一些技巧

在分析一些网页的时候,经常会发现点击某个按钮会触发某个动作,当页面比较复杂,包含的js文件又多,这时候要找到这段触发函数的代码写在哪里就比较困难.比如,在某个html页面中,发现如下一个按钮,点击后会使得页面元素有变化.但是并未看到onclick事件,那说明该事件可能是通过javascript中的addEventListener方法绑定的(IE不支持该方法,使用的是attachEvent,不理解为微软何非要和W3C标准对着干).例如下面的代码: <input type="button&qu

JavaScript中的Touch事件简介

在本教程中,我们可以通过检查触摸相关事件以及如何使用它们来检测和响应触摸和滑动事件,从而轻松获得JavaScript.随着基于触摸的设备数量不断增长,掌握这些事件对于理解老龄鼠标事件至关重要.本教程中的示例可以在触摸和非触摸启用的设备中进行应用,而后者则会回退到您信任的鼠标.准备给那些手指做一点锻炼吗?我们走吧! JavaScript触摸事件 所以让我们潜入它.以下列出了JavaScript中支持的触摸事件: JavaScript触摸事件 活动名称 描述 touchstart 当用户与触摸表面接

javascript中window.event事件用法详解

转自http://www.jb51.net/article/32564.htm描述 event代表事件的状态,例如触发event对象的元素.鼠标的位置及状态.按下的键等等. event对象只在事件发生的过程中才有效. event的某些属性只对特定的事件有意义.比如,fromElement 和 toElement 属性只对 onmouseover 和 onmouseout 事件有意义. 例子下面的例子检查鼠标是否在链接上单击,并且,如果shift键被按下,就取消链接的跳转. 复制代码代码如下: <

JavaScript中的鼠标事件

利用下面这个div标签来做鼠标事件的演示,当把鼠标在‘我是div’和’我是span‘两个位置及其之外的位置上操作时,不同事件操作结果不同 <div class="div1">我是div <br> <span>我是span</span> </div> 1.左键单击事件 click var oDiv = document.querySelector('div'); oDiv.onclick = function(){ consol

javascript中通用的事件侦听器函数

var EventUtil = { addHandler:function (element, type, handler) { if(element.addEventListener){ element.addEventListener(type,handler,false) }else if(element.attachEvent){ element.attachEvent('on'+type,handler) }else { element['on'+type] = handler; }