javascript基础四 (事件应用鼠标滚轮)

var oDiv = document.getElementById("div");
/**
 * ie/chrome:onmousewheel
 * 	event.wheelDelta
 * 	上:120
 * 	下:-120
 * firefox: DOMMouseScroll 必须用addEventListener
 * event.detail
 * 阻止当前事件默认行为
 * return false 阻止的是 obj.on事件名称 = fn; 
 * addEventListener绑定的事件需要通过event下面的preventDefault()
 * 上:-3
 * 下:3
 */

function fn(ev){
	var ev = ev || event;

	var b = true;
	//alert(ev.detail);
	if(ev.wheelDelta){
		b = ev.wheelDelta > 0 ? true : false;
	}else{
		b = ev.detail < 0 ? true : false;
	}

	if(b){
		this.style.height = this.offsetHeight - 10 + "px";
	}else{
		this.style.height = this.offsetHeight + 10 + "px";

	}

	if(ev.preventDefault){
		ev.preventDefault();
	}

	return false;  
	//return false 阻止的是 obj.on事件名称 = fn; 
	//addEventListener绑定的事件需要通过event下面的preventDefault()
}
oDiv.onmousewheel = fn;
oDiv.addEventListener('DOMMouseScroll',fn,false);

你可能感兴趣的:(javascript基础四 (事件应用鼠标滚轮))