自從12月20日考完六級(jí)（丟人），又和閨蜜過了兩天圣誕均践，中間還投了幾份簡歷，學(xué)了學(xué)jquery權(quán)威指南摩幔，期望年前可以在北京找到一份工作彤委。
今天周五啦，知道今天寫的筆記或衡，周六日肯定又會(huì)沉啦焦影。
沒關(guān)系，筆記是寫給自己看的封断，毛病是讓他人挑的斯辰，好幾次我看到自己的筆記里有錯(cuò)別字，大家都不出來指正坡疼，考慮要不要換個(gè)地方寫彬呻，可是都積累這么多筆記換個(gè)地方，還得轉(zhuǎn)移陣地回梧，怪麻煩的废岂，繼續(xù)寫吧！
- 鼠標(biāo)滾輪事件狱意，最早是IE6實(shí)現(xiàn)的湖苞，后來Opera、Chrome详囤、Safari也都實(shí)現(xiàn)了這個(gè)事件财骨。但是在opera9.5之前的版本與通用事件有些設(shè)置有出入。Firefox支持的滾輪事件與通用事件的名字及屬性的設(shè)置也不一樣藏姐。
所以隆箩、要給出一個(gè)跨瀏覽器的解決方案。 - 方案
-
我們希望瀏覽器可以都這么實(shí)現(xiàn)
事件名稱：mousewheel羔杨；
滾輪信息：event.wheelDelta;
EventUtil.addHandler(document,"mousewheel",function(event){
event=EventUtil.getEvent(event);
alert(event.wheelDelta);//上滑120捌臊，下滑-120
}); -
opera早期版本正負(fù)號(hào)顛倒，所以需要這樣
wheelDelta值的正負(fù)號(hào)是顛倒的兜材，需要在代碼中理澎，判斷瀏覽器版本，來做相應(yīng)的處理曙寡。
書上是這樣寫的糠爬，但是由于我還沒有仔細(xì)學(xué)習(xí)瀏覽器對象，所以對瀏覽器版本的區(qū)分還是不大熟悉举庶。也沒找出測試不通過的理由执隧。
EventUtil.addHandler(document,"mousewheel",function(event){
event=EventUtil.getEvent(event);
var delta=(client.engine.opera && client.engine.opera<9.5 ? -event.wheelDelta:event.wheelDelta);
alert(delta);
}); -
Firefox
他支持的鼠標(biāo)滾輪事件名字是DOMMouseScrool;事件信息是：event.detail。
EventUtil.addHandler(document,"DOMMouseScroll",function(event){
event=EventUtil.getEvent(event);
alert(event.detail);//上滑-3，下滑3
}); - 跨瀏覽器的綜合解決方案
- 繼續(xù)為EventUtil添加方法
getWheelDelta:function(event){
if(event.wheelData){
return (client.engine.opera && client.engine.opera<9.5 ? -event.wheelDelta:event.wheelDelta);
}else{
return -event.detail*40;
}
} - 調(diào)用
function handler(event){
event=EventUtil.getEvent(event);
var delta=EventUtil.getWheelDelta(event);
alert(delta)
}
EventUtil.addHandler(document,"mousewheel",handler);
EventUtil.add(document,"DOMMouseScroll",handler);
這是書上給的解決方案镀琉，但是我在測試時(shí)峦嗤，為了兼容歐朋早期版本所寫的代碼，依舊不起效果滚粟，等我仔細(xì)學(xué)了瀏覽器對象寻仗，再想辦法解決，現(xiàn)在歐朋的版本已經(jīng)到26+凡壤，所以也可以忽略這一兼容問題署尤。 - 這個(gè)事件是冒泡事件除了IE8會(huì)冒泡到document，其他瀏覽器都會(huì)冒泡到window
