JS-マウスホイール

12月20日に6級(恥ずかしい)を試験してから、また親友と2日間のクリスマスを過ごして、中間にまたいくつかの履歴書を投げて、jquery権威のガイドラインを学んで、年前に北京で1部の仕事を見つけることができることを期待します.今日は金曜日だから、今日書いたノートを知って、土曜日はまた沈むに違いない.大丈夫、ノートは自分で読むことに书いて、欠点は他の人に选ばせたので、何度も私は自分のノートの中に间违った字があることを见て、みんなはすべて指摘していないで、地方を変えて书くかどうかを考えて、しかしすべてこんなに多くのノートを积んで地方を変えて、また阵地を移転しなければならなくて、とても面倒で、引き続き书きましょう!

マウスホイールイベントは、最初はIE 6で実現されたが、Opera、Chrome、Safariでも実現された.でもopera 9.5以前のバージョンでは、汎用イベントの設定と若干異なっていました.Firefoxでサポートされているローラーイベントは、汎用イベントの名前や属性の設定とは異なります.したがって、ブラウザ間でソリューションを提供します.

案

ブラウザがこのようにイベント名を実現することを望んでいます:mousewheel;ローラー情報:event.wheelDelta;EventUtil.addHandler(document,“mousewheel”,function(event){event=EventUtil.getEvent(event);alert(event.wheelDelta);//スライド120,スライド-120};

operaの初期バージョンは正負番号が逆転しているため、このようなwheelDelta値の正負番号が逆転している必要があり、コードの中でブラウザバージョンを判断し、対応する処理を行う必要がある.本にはこのように書かれていますが、ブラウザのオブジェクトをよく勉強していないので、ブラウザのバージョンの区別にはあまり詳しくありません.テストに合格しない理由も見つからなかった.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彼がサポートしているマウスホイールイベントの名前はDOMMouseScroolです.イベント情報は、event.detailです.EventUtil.addHandler(document,“DOMMouseScroll”,function(event){event=EventUtil.getEvent(event);alert(event.detail);//スライド-3,スライド3});

ブラウザ間の統合ソリューション

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; } }

function handler(event){event=EventUtil.getEvent(event);var delta=EventUtil.getWheelDelta(event);alert(delta)}EventUtil.addHandler(document,"mousewheel",handler); EventUtil.add(document,"DOMMouseScroll",handler); これは本の上であげた解決策ですが、私はテストの時、ヨーロッパの友达の初期バージョンの書いたコードを互換化するために、依然として効果がありません.ブラウザの対象をよく勉強してから、方法を考えて解決します.今、ヨーロッパの友达のバージョンは26+になりました.だから、この互換性の問題を無視することもできます.

このイベントはバブルイベントIE 8以外はdocumentにバブルし、他のブラウザはwindow

にバブルします.