Archive for August, 2009

Flash Player + wmode transparent + Mouse Scroll = FF Disaster

Thursday, August 13th, 2009

Like any web developer can testify, during a day’s work one can come across some serious head scratching problems that require quite a bit of wizardry to get resolved. These problems revolve around solving browser quirks and are often related to the presentation layer. It seems Adobe has decided to join the bandwagon of companies that seem to think that developers have nothing better to do than to sit and solve riddles all day long with this rather nasty bug which has been around for quite sometime, and to which no decent explanation to why it hasn’t been fixed has been given. God knows its not because Firefox is not a popular browser!!! (This also affects Safari and Chrome too!)
I’m referring to the mouse scroll event not working when a flash movie’s window mode is set to transparent (or opaque).

Obviously the Gurus at Adobe have a solution to the problem which if one looks long and hard can be found here ! The solution involves a Javascript calling an AS function to dispatch the MOUSE_WHEEL event!

The code in case it disappears one of these days:


<script language="JavaScript" type="text/javascript">
<!--
if(!(document.attachEvent)) {
window.addEventListener("DOMMouseScroll", handleWheel, false);
}
function handleWheel(event) {
var app = window.document["${application}"]; // I used Mootools DOM selector to get the SWF container.
if (app) {
var o = {x: event.screenX, y: event.screenY,
delta: event.detail,
ctrlKey: event.ctrlKey, altKey: event.altKey,
shiftKey: event.shiftKey}

app.handleWheel(o);
}
}
// –>
</script>

That’s as far the JS is concerned. Next on to the AS3 function:


function handleWheel(event:Object): void {
var obj:InteractiveObject = null;
var objects:Array = getObjectsUnderPoint(new Point(event.x, event.y));
for (var i:int = objects.length - 1; i >= 0; i--) {
if (objects[i] is InteractiveObject) {
obj = objects[i] as InteractiveObject;
break;
} else {
if (objects[i] is Shape && (objects[i] as Shape).parent) {
obj = (objects[i] as Shape).parent;
break;
}
}
}
if (obj) {
var mEvent:MouseEvent = new MouseEvent(MouseEvent.MOUSE_WHEEL, true, false,
event.x, event.y, obj,
event.ctrlKey, event.altKey, event.shiftKey,
false, -Number(event.delta));
obj.dispatchEvent(mEvent);
}
}
ExternalInterface.addCallback("handleWheel", handleWheel);

And there you have it folks!!

Hopefully Adobe can spend time fixing the bug in FP as it would time well spent instead of finding work arounds!