How to show/hide SWF in Firefox without reloading

It’s a bug in Firefox that when you hide and then show SWF (Flex or Flash) again, it will be reloaded.

So, this is workaround.

Firstly, do not use “display: none” CSS to hide the div that contains Flash. Use “visibility: hidden ” instead.

What about layout? Yes, it may be a problem due to “visibility: hidden” just hide the div but still reserve space for it.

Therefore, we will fix it by additional CSS which is “width: 0px; height: 0px;”.

There is one side effect, the browser scroll bar will be longer than content  (I’m not sure why, but you may fix it by JavaScript. It’s out of my scope, so please let me know if any).

Conclusion, in case of we have to show/hide SWF and serious about reloading, we will use “visibility: hidden; width: 0px; height: 0px;” instead of “display: none”

In my case, I use jQuery Tabs.  So, I will fix CSS class from

.ui-tabs .ui-tabs-hide { display: none !important; }

to be

.ui-tabs .ui-tabs-hide { visibility: hidden; width: 0px; height: 0px; }

References:
http://pipwerks.com/lab/swfobject/hide-swf/2.0/index.html
http://stackoverflow.com/questions/298342/firefox-restarts-flash-movie-if-enclosing-div-properties-change

Thanks @tvchampion and @dogdoy for help.