滚轮事件

滚轮的事件

window.onload = function(){
/*
当鼠标滚轮向下滚动时,box1变长
当滚轮向上滚动时,box1变短
*/
//获取id为box1的div
var box1 = document.getElementById("box1");
//为box1绑定一个鼠标滚轮滚动的事件
/*
onmous ewheel鼠标滚轮滚动的事件,会在馆轮滚动时触发,
但是火狐不支持该属性
在火狐中需要使用DOMMouseScro11 来绑定滚轮事件
注意该事件需要通过addEventListener( )函数来绑定
*/
box1.onmousewheel = function(event){
    event = event||window.event;
//判断鼠标滚轮滚动的方向
//event . wheelDelta可以获取 鼠标滚轮滚动的方向
//向上滚120向下滚-120
//wheelDelta这个值我们不看大小,只看正负
alert(event.wheelDelta);
};
    bind(box1,"DOMMouseScroll",function( ){
alert("滚了~~");
});

};

//判断鼠标滚轮滚动的方向
if( event.wheelDelta > 0|| event.detail < 0){
//向上滚,box1变短
box1.sty1e.height = box1. clientHeight - 10 + "px";
}else{
//向下滚,box1变长
box1.style.height = box1. clientHeight + 10 + "px" ;
}

使用addEventListener( )方法绑定响应函数,取消默认行为时不能使用return false
需要使用event来取消默认行为event . preventDefault();
但是IE8不支持event . preventDefault();这个玩意,如果直接调用会报错

posted @ 2022-02-10 15:39  苏槿年  阅读(56)  评论(0编辑  收藏  举报