Zabránit posouvání nadřazeného prvku, když poloha posunu vnitřního prvku dosáhne horní/dolní?

Mám malou „plovoucí skříňku s nástroji“ – div s position:fixed; overflow:auto .Funguje dobře.

Ale při rolování uvnitř tohoto rámečku (kolečkem myši) a dosažení spodní NEBO horní části nadřazený prvek „převezme“ „požadavek na rolování“:Dokument za panelem nástrojů se posouvá.
– Což je nepříjemné a není to to, o co uživatel „požádal“.

Používám jQuery a myslel jsem, že toto chování mohu zastavit pomocí event.stoppropagation():
$("#toolBox").scroll( function(event){ event.stoppropagation() });

Vstoupí do funkce, ale přesto k šíření dojde (dokument se posouvá)
– Je překvapivě těžké hledat toto téma na SO (a Google), takže se musím zeptat:
Jak zabránit šíření/bublání rolovací události?

Upravit:
Funkční řešení díky amustillu (a Brandonu Aaronovi pro plugin kolečka myši zde:
https://github.com/brandonaaron/jquery-mousewheel/raw/master/jquery.mousewheel.js

$(".ToolPage").bind('mousewheel', function(e, d)  
    var t = $(this);
    if (d > 0 && t.scrollTop() === 0) {
        e.preventDefault();
    }
    else {
        if (d < 0 && (t.scrollTop() == t.get(0).scrollHeight - t.innerHeight())) {
            e.preventDefault();
        }
    }
});

Odpověď

Je to možné pomocí pluginu Brandona Aarona Mousewheel.

Zde je ukázka:http://jsbin.com/jivutakama/edit?html,js,output