Problems with mousewheel in jQuery

I have the following code in the head-section:

<script type='text/javascript' src='/js/jquery.mousewheel.min.js'></scrip开发者_开发问答t>

jQuery(function($) {
    $('#box').bind('mousewheel', function(event, delta) {
        var dir = delta > 0 ? 'Up' : 'Down',
        vel = Math.abs(delta);
        alert(dir + ' at a velocity of ' + vel);
        return false;
    });
});

In firefox 5 nothing happens at all. In Chrome 13 and IE 9 I get "Down at a velocity of NaN", no matter at which direction I scroll.

How can I fix this? What I want to do is to check if the user is scorlliing upwards, or if he´s scrolling downwards.

Thanks for your help!

Not working either with new jQuery 2.0.1... well, it works but not as desired. This code only detect down movement (that means negative delta). I have tried this code and the result is always negative:

var num = 0;

$('#container').bind('mousewheel DOMMouseScroll',function(e, delta) {
    if(delta > 0) {
        $("#output").text(++num);
    } else {
        $("#output").text(--num);
    }

    e.stopPropagation();
    e.preventDefault();
});

The DOMMouseScroll is the same as mousewheel but for Firefox.

CORRECTION

I have found this new code in this post and now it's working in Chrome and Firefox (I have fixed it) with jQuery 2.0.1. The problem was that the delta value returned was undefined.

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

var num = 0;

$('#container').bind('mousewheel DOMMouseScroll',function(e) {
    var d = extractDelta(e);

    if(d > 0) {
        $("#output").text(++num);
    } else {
        $("#output").text(--num);
    }

    e.stopPropagation();
    e.preventDefault();
});

Container and output are just two empty divs.

Here is a cross-browser solution:

var onMouseWheel = function(e) {
    e = e.originalEvent;
    var delta = e.wheelDelta>0||e.detail<0?1:-1;
    alert(delta);
}
$("body").bind("mousewheel DOMMouseScroll", onMouseWheel);

It means that delta is undefined which probably means you didn't include the proper plugin, or included it in the wrong place.

Don't know what you download, I've tried now with this and it's working fine.

If you remove the external resource, it won't work as happens in your case.

Works fine with jQuery 1.6.x, but does NOT work with jQuery 1.7.x
Seems like something broke in jQuery.