Question

I’m using Javascript’s mouse event to pass information about mouse position to flash and show the specific animation frame depending on mouse position.

The problem is, when mouse is over flash object, it doesn’t fire javascript event anymore. I’ve tested it on Chrome and it seems to be working, but Firefox doesn’t want to cooperate.

My flash object is located in the middle of website and has transparent background. It has to stay this way. Also, I’d rather not move the action to the ActionScript for two reasons:

1. Website’s width is not constant (different browsers for example) so I’d have to push viewport’s width to the flash too, which will complicate the script, also mouseenter events etc.

2. I don’t know AS very well.

The code: (I’m using jQuery here because it’s also used somewhere else on the page, previous mockup used plain JS)

    function viewport()
    {
        var e = window
        , a = 'inner';
        if ( !( 'innerWidth' in window ) )
        {
        a = 'client';
        e = document.documentElement || document.body;
        }
        return e[ a+'Width' ];
    }

    puszka = document.getElementById("puszka");

    $().mousemove(function(e)
    {
        var x = e.pageX || e.clientX + document.body.scrollLeft;
        var frame = Math.floor(x * 100 / viewport());
        puszka.transformCan(frame);
    });

Answer 1

Actionscript is able to recognize mouse events like move, click etc.
So I assume Firefox passes the Responsibility to the flash object when it comes to the area where flash is the master of all.

Handling mouse move in AS isn’t difficult. If you know Javascript you can also code Actionscript efficiently using the provided Documentation.

If I remember correctly you only have to add the stage to the listener:

stageObj.addEventListener(MouseEvent.MOUSE_MOVE, yourFunction);

and then have “yourfunction” be the handler that is able to call your javascript function via “ExternalInterface”.