tag:opensoul.org,2009:/2007/4/26/firefox-mac-flash-css-opacity-peek-a-boo/changes Mephisto Drax 2007-04-26T13:46:34Z brandon tag:opensoul.org,2007-04-26:297:3 2007-04-26T13:43:13Z 2007-04-26T13:46:34Z <p>I came across a fun browser bug this morning that I thought I would share. You can’t have a semi-transparent element cover a Flash animation Firefox on the mac.</p> <p>I had a popup menu that used <span class="caps">CSS</span> <code>opacity</code> to make the menu semi-transparent. It was working fine, but then we threw in a Flash header and the Flash would hide any time you moused over a menu item.</p> <p>Here are some screenshots that demonstrate the bug. The first is how it looks in Safari, the second demonstrates the bug in Firefox, and the third shows Firefox if I remove the <code>opacity</code> attribute from <span class="caps">CSS</span>.</p> <p></p> <p></p> <p></p> <p>The solution: for now, I’ll just have to live without semi-transparent menus (but they looked so good).</p> <p>I would venture to guess that this is intentional behavior by Firefox. Since Firefox isn’t a native Cocoa app, it doesn’t have access to all the fancy <span class="caps">OS X</span> rendering, so it can’t render transparent elements over elements that it doesn’t have control of (Flash), and it just removes the Flash.</p> brandon tag:opensoul.org,2007-04-26:296:2 2007-04-26T13:43:13Z 2007-04-26T13:45:45Z <p>I came across a fun browser bug this morning that I thought I would share. You can’t have a semi-transparent element cover a Flash animation Firefox on the mac.</p> <p>I had a popup menu that used <span class="caps">CSS</span> <code>opacity</code> to make the menu semi-transparent. It was working fine, but then we threw in a Flash header and the Flash would hide any time you moused over a menu item.</p> <p>Here are some screenshots that demonstrate the bug. The first is how it looks in Safari, the second demonstrates the bug in Firefox, and the third shows Firefox if I remove the <code>opacity</code> attribute from <span class="caps">CSS</span>.</p> <p>p=.</p> <p>p=.</p> <p>p=.</p> <p>The solution: for now, I’ll just have to live without semi-transparent menus (but they looked so good).</p> <p>I would venture to guess that this is intentional behavior by Firefox. Since Firefox isn’t a native Cocoa app, it doesn’t have access to all the fancy <span class="caps">OS X</span> rendering, so it can’t render transparent elements over elements that it doesn’t have control of (Flash), and it just removes the Flash.</p> brandon tag:opensoul.org,2007-04-26:295:1 2007-04-26T13:43:13Z <p>I came across a fun browser bug this morning that I thought I would share. You can’t have a semi-transparent element cover a Flash animation Firefox on the mac.</p> <p>I had a popup menu that used <span class="caps">CSS</span> <code>opacity</code> to make the menu semi-transparent. It was working fine, but then we threw in a Flash header and the Flash would hide any time you moused over a menu item.</p> <p>Here are some screenshots that demonstrate the bug. The first is how it looks in Safari, the second demonstrates the bug in Firefox, and the third shows Firefox if I remove the <code>opacity</code> attribute from <span class="caps">CSS</span>.</p> <table> <tr> <td></td> <td></td> <td></td> </tr> <tr> </tr> </table> <p>The solution: for now, I’ll just have to live without semi-transparent menus (but they looked so good).</p> <p>I would venture to guess that this is intentional behavior by Firefox. Since Firefox isn’t a native Cocoa app, it doesn’t have access to all the fancy <span class="caps">OS X</span> rendering, so it can’t render transparent elements over elements that it doesn’t have control of (Flash), and it just removes the Flash.</p>