www.webdeveloper.com
Results 1 to 8 of 8

Thread: problems with z-index in firefox

  1. #1
    Join Date
    Jun 2006
    Posts
    11

    Question problems with z-index in firefox

    This is my first post to the forum, so hello to WebDeveloper.com I'm good with HTML. I'm very new with CSS which I agree is more efficient for style and layout. I'm pretty sure this is a question for this forum, sorry if not.

    Now to my question, which I hope I ask sufficiently.

    I have 3 objects layered on a website index page. An image, and 2 flash objects. I have them positioned where I want them, and they layer over each other as desired. The image is meant to be the bottom layer, which has worked fine. The two flash files, however, are layered incorrectly in Firefox, however it is displaying fine in IE. ("example1.swf" displays behind "example2.swf" in Firefox, when it should be vice-versa "example2.swf" should display behind "example1.swf").

    My relevant CSS code is as follows:
    Code:
    .image-pos {
    position:absolute;
    left:-30px;
    top:-16px;
    z-index:1
    }
    .example1-pos {
    position:absolute;
    left:315px;
    top:260px;
    z-index:2
    }
    .example2-pos {
    position:absolute;
    left:570px;
    top:275px;
    z-index:3
    }
    and here are the HTML objects I am positioning:


    HTML Code:
    <img class="image-pos" src="images/main.jpg" alt="..." border="0" width="593" height="600" />
    
    <table class="example1-pos">
    <tr>
    <td>
    <script src="scripts/javascripts/call-example1.js"></script>
    </td>
    </tr>
    </table>
    
    <table class="example2-pos">
    <tr>
    <td>
    <script src="scripts/javascripts/call-example2.js"></script>
    </td>
    </tr>
    </table>
    If you're wondering why I called my flash from external javascript file, I did it because it gets rid of new activation box that is displayed around flash files in IE. If there is a more efficient way to do this please do say, I would appreciate it. Also, and more importantly, how can I get these flash files to layer correctly in Firefox.

    I hope I didn't break any rules with this post I am new here.
    Thanks for your time,

    Jeremy

    PS: I am going to be needing a navigation menu system for this site. I would like the menu to be smooth, sleek, and contemporary. Any quick advice, or guidance to your favorite reference material on this, would be appreciated.

  2. #2
    Join Date
    Dec 2005
    Location
    American, living in Toronto, ON. CANADA
    Posts
    6,746
    I do not beleive that there is an easy way to 'layer' FLASH. It's tricky and unpredictable, if at all possible. I read here not too long ago something to the effect that FLASH is akin to 'z-index;infinity'. That is to say, you can't put anything 'above' it, because it will always be 'one up' still.
    Someone more familar with FLASH might re-post the link that explains this better.
    Last edited by WebJoel; 06-18-2006 at 07:16 AM.

  3. #3
    Join Date
    Jun 2006
    Location
    Moscow
    Posts
    13

    Lightbulb

    use iframes

  4. #4
    Join Date
    Jun 2006
    Posts
    11
    WebJoel: I can see where you may be right. Thanks for the heads-up on that.

    --

    I'm going to wait (maybe a couple of days) to see if anyone has a solution that can make this work, or a workaround. During that time, I'll also be trying to find a more efficient way do display my flash art.

    Thanks again

  5. #5
    Join Date
    Jun 2006
    Posts
    11
    Quote Originally Posted by Bog Zaicev
    use iframes
    Use iFrames where and for what reason? Your solution is too blunt. I do not understand. Please elaborate, if you don't mind.

    Thanks for the reply

  6. #6
    Join Date
    Jun 2006
    Location
    Moscow
    Posts
    13
    Quote Originally Posted by soulmachine
    Use iFrames where and for what reason? Your solution is too blunt. I do not understand. Please elaborate, if you don't mind.

    Thanks for the reply
    my english is very poor

    You can put flash into iframes, so it should layer correctly in Firefox.

  7. #7
    Join Date
    Mar 2005
    Location
    Sydney, Australia
    Posts
    7,974
    Putting the flash into iframes will allow you to set the iframes to the appropriate zIndex that you require in all browsers except for Opera (which does the same thing with iframes as most browsers do with flash and puts them on top of everything else).

    The only real solution is to make sure that the two flash objects never overlap as there will always be situations where you can never predict which one will be on top.
    Stephen

  8. #8
    Join Date
    Jun 2006
    Posts
    11
    Awesome.

    Bog Zaicev & felgall :: Thanks for you suggestions!

    Great first experience on this forum.

    ------
    edit: Also, I've decided to NOT layer flash. It's too unpredictable, and after a night of sleep and waking up to view my progress, I realized it was too cluttered looking anyway.

    Thanks again
    Last edited by soulmachine; 06-18-2006 at 03:46 PM.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles