event.wheelDelta는 정의되지 않은 값을 반환합니다.

Question

라이트 박스가 열리면 내 페이지에서 스크롤을 사용하지 않으려 고합니다. 정확히이 스크립트를 사용하면 매우 유용합니다. (http://jsfiddle.net/mrtsherman/eXQf3/3/), 안타깝게도, 내 자신의 페이지에서 사용할 때, 라이트 박스에서 스크롤을 사용할 수 없게됩니다. 나는 경고가있는 코드를 디버깅하기 시작하여 event.wheelDelta는 내 페이지에서 "정의되지 않음"을 반환하고 JSFiddle에서는 -120을 반환한다는 것을 알기 시작했습니다.

Answer 1

JQuery와 이벤트 핸들러의 event 객체는 실제 사건을 반영하지 않습니다. wheelDelta은 비표준 이벤트 속성 ^{IE와 Opera}이며 jQuery 이벤트의 originalEvent 속성을 통해 사용할 수 있습니다. 의 jQuery 1.7+에서

는 detail 속성은 jQuery를 이벤트 객체에서 사용할 수 없습니다. 따라서 DOMMouseScroll 이벤트에서이 속성으로 event.originalEvent.detail을 사용해야합니다. 이 방법은 이전 jQuery 버전과 역 호환됩니다.

event.originalEvent.wheelDelta 

데모 : 또한 http://jsfiddle.net/eXQf3/22/
참조 : http://api.jquery.com/category/events/event-object/

Answer 2

$.fn.wheel = function (callback) { 
    return this.each(function() { 
     $(this).on('mousewheel DOMMouseScroll', function (e) { 
      e.delta = null; 
      if (e.originalEvent) { 
       if (e.originalEvent.wheelDelta) e.delta = e.originalEvent.wheelDelta/-40; 
       if (e.originalEvent.deltaY) e.delta = e.originalEvent.deltaY; 
       if (e.originalEvent.detail) e.delta = e.originalEvent.detail; 
      } 

      if (typeof callback == 'function') { 
       callback.call(this, e); 
      } 
     }); 
    }); 
}; 

과 같이 사용 JQuery와-된 fying 기능에 대한 @ 마크하는

$('body').wheel(function (e) { 
    e.preventDefault(); 
    $('#myDiv').append($('<div>').text(e.delta)); 
}); 

큰 THX (:

Answer 3

해결책을 시도했습니다. psycho brm, 나는 Firefox에서 작동하도록 extractDelta(e) 함수를 변경했습니다. e.detail 대신 e.originalEvent.detail을 사용했습니다. Firefox가 정의되지 않은 델타를 반환했기 때문입니다. 이 post에 솔루션과 테스트 코드를 업로드했습니다. 나는 그것이 도움이되기를 바랍니다. 웹킷과 FF의

function extractDelta(e) { 
    if (e.wheelDelta) { 
     return e.wheelDelta; 
    } 

    if (e.originalEvent.detail) { 
     return e.originalEvent.detail * -40; 
    } 

    if (e.originalEvent && e.originalEvent.wheelDelta) { 
     return e.originalEvent.wheelDelta; 
    } 
} 

Answer 4

$(this).on('mousewheel DOMMouseScroll', function(e){ 

    var dat = $(e.delegateTarget).data(); //in case you have set some, read it here. 
    var datx = dat.x || 0; // just to show how to get specific out of jq-data object 

    var eo = e.originalEvent; 
    var xy = eo.wheelDelta || -eo.detail; //shortest possible code 
    var x = eo.wheelDeltaX || (eo.axis==1?xy:0); 
    var y = eo.wheelDeltaY || (eo.axis==2?xy:0); //() necessary! 
    console.log(x,y); 

}); 

작품, 수 여기에없는 증거 IE :(나는 비슷한 문제를 했어 그것은 DOM 네임 스페이스 지정에 내려와