HTML scrolls simultaneously in page and Flash object

Question

I have a flash object inside a div, that will zoom it's content when I scroll over it. the problem is that my page also scrolls and I don't know how to fix this problem. I need the page to stand still when I scroll over the flash.

I tried adding this

 flashContainer.bind('mousewheel DOMMouseScroll', function(e) {
                var scrollTo = null;

                if (e.type === 'mousewheel') {
                    scrollTo = (e.originalEvent.wheelDelta * -1);
                } else if (e.type === 'DOMMouseScroll') {
                    scrollTo = 40 * e.originalEvent.detail;
                }

                if (scrollTo) {
                    e.preventDefault();
                    $(this).scrollTop(scrollTo + $(this).scrollTop());
                }
            });

but because of preventDefault, the flash object won't zoom anymore.

Do you have any suggestions?

Answer 1

may be this could work for you:

$("element").hover(function(){
    var scrollT = $(document).scrollTop();
    $(document).on("scroll", function(e){
        $(document).scrollTop(scrollT);
    });
}, function(){
    $(document).off("scroll");
});

http://jsfiddle.net/ZFsDY/3/

Answer 2

I stumbled on this issue a few months ago (the old method we used to manage scrolling didn't work on the most recent browsers). I'm not allowed to publish the code for it, but here a few note on how we did it.

Like in reyaner's answer, we use event listening and preventDefault() to disable the browser auto scrolling, and get the scroll value (but without scrollTop()). Once we have the value, we send it to the Flash via ExternalInterface. For it to be possible, the flash object must beforehand add a Callback, a Flash method that can be called by Javascript.

We added a couple of additional interaction between Flash and JS so that the scroll is locked only when the Flash has the focus.

A warning : all browser don't have the same scale for the wheelDelta, and you may find that the zoom speed can vary. To fix this we decided to always use a fixed step each time the event is dispatched, instead that using the delta as-is.