Firefox Problem w/ Layer Visibility and Iframe

Posted on 2005-04-18
Last Modified: 2008-03-03
What I am trying to do is through javascript have a Flash Application that loads up outside webpages in iframes that are held in layers. This all works fine and good in IE, but dies a painful death in Firefox. I believe I am getting control of the positioning issue in Firefox (At first it was all popping up in the upper left corner), but can't seem to find/fix the issue of controlling the visibility. Basically the frames come up and disappear, can't control the scroll bar on the iframe (i assume due to the layering/visibility issues), and it "blacks out" the area where it should be when it isn't visible on top of the Flash App that is running on the bottom of the layering.

I hope that makes some amount of sense.

The code for the layers is pretty straightforward:

<div id="WorldLayer" style="position:absolute; left:85px; top:145px; width:700px; height:390px; z-index:2; visibility: hidden;">
<iframe src="" name="WorldFrame" id="WorldFrame" width="700px" marginwidth="0px" height="390px" marginheight="0px" scrolling="yes"></iframe>

The javascript for bringing it up is:

function GoCamera() {
window.document.getElementById("WorldLayer").style.left = "85px";
window.document.getElementById("WorldLayer") = "145px";
window.document.getElementById("WorldFrame").src = "address";
window.document.getElementById("WorldLayer").style.visibility = "visible";

Basically just trying to get this up and working in Firefox as quickly as possible. Any help is much appreciated.
Question by:AlexSilverman
    LVL 16

    Expert Comment


    Maybe you can try to use

    window.document.getElementById("WorldLayer").style.visibility = "inline";

    By the way, is the problem just concerning being unable to show back the hidden layer?


    Author Comment

    in firefox it seems to lack control over the visibility. so when it is supposed to be visible it is all sorts of screwed up, and it never really goes away completely from the screen when it is supposed to be there.

    a flash app is running in the bottom layer, which uses javascript to reveal the layers and tell what the source for the iframe is.
    LVL 10

    Expert Comment


    This has come up a few times. It seems that in all browsers besides IE, Flash is rather like a form control; that is to say, it doesn't like having other elements layered over it and will tend to show through, or at least ruin the rendering of what's on top.

    You might want to try placing an element (like a DIV) around the Flash content so you can apply CSS invisibility to it when the other layer is over it.

    Author Comment

    can't make the flash invisible... the iframe is "inside" the flash app...
    LVL 10

    Accepted Solution

    Then I'm afraid it's not gonna happen, unless you were to break apart the Flash into separate 'frame' sections and a center section (the bit that gets covered by the iframe). So if the whole Flash area surrounds the iframe on all sides, that's a minimum of 5 separate movies. If they don't need to interoperate with each other, I guess it might be worthwhile, but it's still a lot of work!

    Featured Post

    How to run any project with ease

    Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
    - Combine task lists, docs, spreadsheets, and chat in one
    - View and edit from mobile/offline
    - Cut down on emails

    Join & Write a Comment

    Suggested Solutions

    For those who don't know, Adobe Dreamweaver is a popular commercial web editor that enables you to design, build and manage complex websites. The editor is a WYSIWYG (What You See Is What You Get) web editor, which means that you can create your web…
    This article is very specific and is only intended to help if you are installing Dreamweaver 8 in a Windows 7 environment with Office 2007 installed.   I'm not sure why Microsoft tends to release OS' that should not be released but they do.  Windows…
    how to add IIS SMTP to handle application/Scanner relays into office 365.
    Polish reports in Access so they look terrific. Take yourself to another level. Equations, Back Color, Alternate Back Color. Write easy VBA Code. Tighten space to use less pages. Launch report from a menu, considering criteria only when it is filled…

    745 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    18 Experts available now in Live!

    Get 1:1 Help Now