Facebook Development wmode=transparent Flash Woes With Firefox on Windows
Posted by Tres Sat, 21 Mar 2009 08:51:00 GMT
So if you’ve done any Facebook development, you know that every little achievement is a real victory. It’s a grueling, punishing process of doing something the way you would normally do it, then doing it all over again the FBML/FBJS way, or doing the FBML way while all the while knowing it would have taken 10 minutes if only this tag were available, or five minutes if jQuery were available (Nothing like going back to Ajax() to get stuff done). It’s fun in some ways – you get to appreciate the small things again. Heh… I can’t believe I just wrote that.
Our first apps were web apps using Ruby on Rails and Facebooker and integrated Flash elements into the entire experience. The end results took over three times as long as we had estimated, and were truly disappointing. The silver lining were the lessons we were able to learn. One of the big lessons was that we weren’t going to try dealing with FBML / FBJS issues on top of browser variation issuses on top of everything else.
So for our new batch of applications, I decided to go pure Flash. The overall user experience is better, the development time was right on schedule, and we’re pretty happy with the result. Everything has gone smoothly EXCEPT for the one place where we’re using FBML. I mean, it’s appropriate because this is really the ONLY fb tag that we’re using, and it still caused issues.
So by default the <fb:swf> tag uses wmode=transparent, which causes issues in Firefox if your window happens to run outside of the viewable area for the browser. In other words, if they have to scroll to see the bottom of the application only in Firefox and only on Windows, the mouse coordinates get all hosed.
Luckily the guys over at at Facebook allow you to use wmode=transparent|opaque|window, but transparent is the default. So just pick the correct mode for your Flash app & be on your merry way.