Disable scrolling but capture scrolling data with JavaScript?

Question

I'm trying to prevent default scrolling behavior while still determining the number of pixels a user has attempted to scroll.

My objective is (at some vertical position on my page) to fix a navigation element to the top of the screen and hijack the scroll/swipe event to pull down a mobile menu when the user scrolls back up (so moving said element up and down by n pixels depending on how many pixels the user tries to scroll).

I am aware of the UX/accessibility concerns insofar as blocking native behavior, but the suits want what the suits want.

So far I have:

$('body').on({
 'mousewheel' : function(e) {
    e.preventDefault(); 
    e.stopPropagation();
 }
}); 

but am stumped as to how to access the number of pixels scrolled (since element/scroll offsets are no longer a guide).

Edit: Please note that this question is specifically asking for information regarding mouse/scroll actions while scrolling is blocked. Don't think this has been appropriately marked as duplicate.

Answer 1

This is browser-depended because of the mousewheel event you are using. This is because it is non-standard. Don't use it!

In Chrome (43.0) you get different properties with different values:

e.originalEvent.wheelDelta: -120
e.originalEvent.wheelDeltaY: -120
e.originalEvent.deltaY: 100

In IE (11.0), you can get only one property:

e.originalEvent.wheelDelta: -120

In Firefox (38.0.5), the capturing of the mousewheel event doesn't work at all.

Solution:
Use the wheel event (MDN reference). This event has the e.originalEvent.deltaY property in all browsers.