My flash reinitializes (reloads) when resizing a container (via javascript - jQuery) in FireFox

Question

I have a flash in a div holder (flash container). I use swfobject to insert a flash object (if that matters).

I want to resize this div holder so that it is smaller in width when I reach level two in my flash application. (with jQuery.animate () function).

What does “flash application” mean: I have a human body that I can click on in different areas of the body. This is the first action - and the effect is to bring it closer to a specific area of ​​the body.

Then I can click again on a more specific area in this area - and the effect is to extract some material through ajax. (these are some medical things, diseases, etc.) - this is the "second level" in my "flash application".

Then I can click on this material extracted through ajax - when I resize the flash holder.

The problem is that due to this resizing, my flash reboots and returns to its original state without this zoom level. This reboot appears on the “second level”, and not when I click on the material extracted with ajax and the size of the flash holder changes. But this is the reason for the reboot, because without this resizing everything is fine.

The problem is only in Firefox, I tested it in IE6,7,8, Opera 10, Safari latest version and Chrome, and there is nothing bad there, flash does not work.

I hope you understand what I'm saying here :) If I had not sent you a private message with a URL to see what I mean (I cannot make it publicly available)

Thanks,

Adrian

Answer 1

The issue you are experiencing is noted in the next jQuery # 4872 ticket. A simple solution for this is to set the style of the animated wrapper #wrapper { overflow: hidden !important; } #wrapper { overflow: hidden !important; } . This will stop your Flash object on reboot during animation.

Answer 2

I tried to animate the div as you described, and I get the same behavior. Instead of trying to solve this problem, I suggest getting around it.
fe, leave the original div alone, and let another div that sits on top of the flash animation.

Note: Remember to use wmode: "transparent" when embedding SWF, so that you can correctly use the z-index to be placed over the SWF.