css vs. flash... need help.. badly T_T browser conflicts.

Discussion in 'CSS' started by bartolay13, Jan 30, 2008.

  1. #1
    hello there,

    please check my site http://www.peopledynamics.ph

    the main menu(upper) has a drop down menu(css only).. when i open it in IE it works perfectly and on top of the flash window, but in firefox it is showing under the flash window..

    please help me with this one, I know this one is simple, but just cant get it..

    thanks..
     
    bartolay13, Jan 30, 2008 IP
  2. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Wow, really? I thought it was IE who always put Flash above the rest of the page. I think it does still... it used to almost make a "new" page for Flash and the Flash would "float" above the page.

    Okay, first, your page has huge major death-defying issues.

    You have multiple doctypes, mulitple instances of <html> and </html>. You may only have one of each per web page.

    Also, the only browser I can get to show the menu on top is IE6 and 7. Safari, Opera, FF and Konqueror ALL have the menu behind.

    Send your page to the html validator http://validator.w3.org/ and clean up everything. You may never get the various scripts and widgets to validate, but get the rest of the page cleaned up. It's impossible to fix a problem and leave a page that way.

    Second, I dunno if you want to try this, but right now you're using the "Twice Baked" method of embedding: <object> tag for IE and <embed> for the Mozillas. <embed> will not validate cause it's not a valid tag, but since <embed> has more functionality cross-browser, many people leave it in. But if you want, you could try the Satay method, which leaves you with just the <object> tag, and see if you can't style that with z-index or something. Esp with css dropdowns, there's usually a high z-index on the subs so they always sit above the page and don't interfere with whatever's underneath.
     
    Stomme poes, Jan 31, 2008 IP
  3. bartolay13

    bartolay13 Active Member

    Messages:
    735
    Likes Received:
    14
    Best Answers:
    1
    Trophy Points:
    98
    #3
    OK.. i have figured whats wrong..

    guys fyi..

    put this under the <param>

    <param name="wmode" value="transparent">

    and inside the embe tag put

    wmode="transparent"

    this puts the flash always behind the css..

    ^^,
     
    bartolay13, Feb 4, 2008 IP
  4. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #4
    Use wmode="opaque" instead. Transparent is more cpu intensive and slower, plus there are potential bleed-through issues.

    You should be aware there was a bug in Firefox (since fixed) that caused Flash to not render windowless in X (Linux and OSX). In working with Adobe, it was discovered that Flash also has a bug also that breaks windowless mode in X. KHTML/Webkit engines use a "dirty" work-around for Konqueror and Safari. Mozilla, for technical reasons, has not applied the same patch. Adobe is working on their bug.

    It would be a Good Thing to redesign to avoid the conflict if possible.

    cheers,

    gary
     
    kk5st, Feb 5, 2008 IP
  5. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #5
    Ah, is that why my FF1.5 always acted like"opaque" when I'd set it to "transparent"... FF2 was fine. Opera was a problem but then it got fixed too (was only displaying the object's child gif). Good to know, though sometimes one can't avoid wmode transparent depending on the intended effect... Flash being square box and all : (
     
    Stomme poes, Feb 6, 2008 IP
  6. kk5st

    kk5st Prominent Member

    Messages:
    3,497
    Likes Received:
    376
    Best Answers:
    29
    Trophy Points:
    335
    #6
    Good point on the rectangular(!) box thing. Let me rephrase. If you don't absolutely have to have a see-through canvas in your flash object, use "opaque" for faster rendering and more efficient use of cpu cycles. :)

    cheers,

    gary
     
    kk5st, Feb 6, 2008 IP
  7. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #7
    Yeah I got ya : ) Good to see you back, gary. I didn't know about the faster rendering thing, I only noticed that if I'm using the Satay method (only the object tag), a lot of browsers had trouble dealing with anything outside the norm. I guess what you said earlier is why my Konqueror is still having fits.

    I'm not sure that transparent was the best solution to this guy's problem-- if he could just have the menu always higher (with z-index or something) on the page, you could keep the opaque. Right now he's hoping the Flash let's the menu show through... sounds kind of hope-and-pray.
     
    Stomme poes, Feb 7, 2008 IP