3 Replies Latest reply on Sep 19, 2007 7:25 AM by Patch1897

    Need to embed a Flash animation over top of a html page!


      I've created an animation in Flash with a transparent background which needs to be embedded into a html page with lots of div tags. I didn't create the html page and now I need to place the animation into that page somehow, overlapping with some text and graphics. Every where I place the animation, it will sit before or after the text and elements in the page and not over top of them. Hope I am clear enought to explain what my problem is. Does anybody know what I should do? I truly appreciate your help.

      PS. I am not a technical person so if any body wants to help me and needed the sources please email me at:

      Many thanks in advance.
      Mojan Mojan
        • 1. Re: Need to embed a Flash animation over top of a html page!
          Nick Barling Level 1
          Treat Flash as any other content and place it within its own containing div. Position the div in the normal flow of the document allowing the div to 'stack' with the other divs above and below it. If you want to place the Flash such that it 'covers' existing content you can use CSS positioning techniques. Options include absolute positioning the containing div with the Flash swf within it (this removes the div from the normal flow of the document) and placing it over the existing content. Us position: absolute; and top and left, with px values to place the div where you need it. You can find tutorials on absolute positioning in the developer center or www.communitymx.com

          You can use the float property and negative margins to pull containing divs (or other elements) around the document, too. Experimenting with floats can be fun but you need to read up on their specific behavior as you can end up pulling your hair out. Again, there are plenty of CSS tutorials on positioning and a Google search should throw-up some options.

          Outside of CSS you can use DOM Scripting and JavaScript to also position and hide various content depending on your requirements. If you get stuck come back on this forum and ask for more help but provide specific code to help us.
          • 2. Re: Need to embed a Flash animation over top of a html page!
            Mojy Level 1
            Thanks for your response.
            Actually, I've tried several times to embed it properly but couldn't! I'm not really a technical person but for some reason I feel this shouldn't be so difficult but I've been working on this for hours now but no luck yet. The animation is still sitting before or after the content and not sitting over top of it. Please review the source code below:

            I added also more coding of the content in order for you to get where my problem is coming from. I'm so desperate! Please help me out with this. Please let me know if you needed any more coding or so.

            PS. I also added this part into the css file:
            position: absolute: left:120px; top:150px;
            Thanks again for all your help.

            • 3. Re: Need to embed a Flash animation over top of a html page!
              I don't known if it will fix the problem. But you are missing a close quote in your first line.
              <DIV id="middle" style="position:absolute> <--after absolute