Disabling main window scrolling onmouseenter iframe in firefox

Question

I want to disable scrolling on the main page but not within the iframe when the mouse is over it. You can see what I mean more clearly here.

If the iframe were picking up mousewheel events then I don't want the whole page to scroll down when the mouse is inside the iframe. Note that it is working in chrome just not in ff.

Edit: The keyboard component even works as expected!

Note:

Scrolling enable/disable is based on the code here

Answer 1

Much simpler solution:

Give your parent body an id ("bodyID" in the example), then in your enable and disable scroll functions just add:

function disable_scroll()
{
    document.getElementById("bodyID").style.overflow="hidden";
}

function enable_scroll()
{
    document.getElementById("bodyID").style.overflow="auto";
}

Basically, since you don't want the parent page to scroll, instead of targeting individual events, just disable scrolling for the parent page altogether while the cursor is inside the iframe. Simple, cross-browser, and much more direct.

In fact, you could eliminate 90% of your code, and just use

function disable_scroll()
{
    document.getElementById("bodyID").style.overflow="hidden";
}

function enable_scroll()
{
    document.getElementById("bodyID").style.overflow="auto";
}
document.getElementById("miframe").onmouseenter = disable_scroll;
document.getElementById("miframe").onmouseleave = enable_scroll;

you could use document.body, but that runs into confusion when you're playing with JSBin or the like and there's a half dozen (ok, three, but still) documents and bodies.

Check Modified JSBIN here.