4 Replies Latest reply on Jun 3, 2012 5:44 AM by rob day

    Pleaseeeeeee Help - Problems with position of my web page

    aljosacr

      Hi, first sorry on my english

       

      I have problem with position of my page. I had made my web page in Indesign CS5 and exported to swf file. My web page is working fine (www.igor-flytying.com) but the page is not in the middle of the web browser. How can I fix the problem????? I am a beginer in Indesign. I had try to make some changes in html file (salign) but still nothing.

       

      Please HELLLLLPPPPPP

       

      Regards

      Aljosa

        • 1. Re: Pleaseeeeeee Help - Problems with position of my web page
          rob day Adobe Community Professional & MVP

          To center a .swf you have to use an HTML table or DIV. Start by making your SWF dimensions small enough to fit inside a typical screen—less than 1024x768. So here I have an 800x600 pixel ID page with export set to Width and Height (not Scale):

           

          Screen shot 2012-04-23 at 10.13.19 AM.png

           

          To center my 800x600 swf in a browser I can wrap it in a DIV that is styled like this:

           

          <div style="width: 800px; height: 600px; margin-left: -400px; margin-top: -300px; position: absolute; left: 50%; top: 50%;">

           

          Where the width and height match the swf's width and height, the margin-left is half the width, and margin-top is half the height.

           

          You'll need to edit the ID generated HTML code to something like this substituting your dimensions:

           

          Screen shot 2012-04-23 at 10.25.45 AM.png

          • 2. Re: Pleaseeeeeee Help - Problems with position of my web page
            aljosac

            Rob Day you are the king, the master .......

             

            It works and I had also change my px in the code and I like it.

             

            Thanks again and best regards from Slovenia.

             

            Aljosa

            • 3. Re: Pleaseeeeeee Help - Problems with position of my web page
              Petteri_Paananen Level 4

              Html-file indesign creates sucks IMO... I'd rather use free SWFobject tool for creating completely new Html-wrapper and replace original one with it... It's much ligther and you have more control over preferences of SWF like position and scaling...

              • 4. Re: Pleaseeeeeee Help - Problems with position of my web page
                rob day Adobe Community Professional & MVP

                Petteri, SWFObject is much better because it loads the JavaScript so you don't see it inside the HTML page, but it still wraps the swf in a div which by default will be positioned in the upperleft of the browser window.

                 

                 

                 

                This is the only way I've been able to center using SWFObject—note that it's the "flashcontent" div style that does the centering not the align embed parameter:

                 

                 

                <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

                <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

                <head>

                <title>S W F | Centered</title>

                <meta http-equiv="Content-Type" content="text/html" />

                 

                 

                <!-- Centers the swf on the page. Note: width and height need to match the swf and margin left and right are -.50%-->

                <style type="text/css">

                          #flashcontent {width: 1000px; height: 750px; margin-left: -500px; margin-top: -375px; position: absolute; left: 50%; top: 50%;}

                </style>

                 

                 

                          <script type="text/javascript" src="swfobject.js"></script>

                          <script type="text/javascript">

                                    var flashvars = {};

                                    flashvars.myFlashVar = "Testing";

                 

                                    var params = {}; //Embed parameters: http://kb2.adobe.com/cps/127/tn_12701.html

                                    params.quality = "best";

                                    params.align="t"

                 

                                    //SWFObject parameters: http://code.google.com/p/swfobject/wiki/api

                                    swfobject.embedSWF("swftest.swf", "flashcontent", "1000", "750", "10.0", false, flashvars, params);

                          </script>

                </head>

                 

                 

                <!-- ALT HTML TEXT-->

                <body style="background-color: #888888">

                          <div id="flashcontent">

                                    <a href="http://www.adobe.com/go/getflashplayer"><img src="getFlash.gif"  alt="adobe icon" border="0" /></a>

                          </div>

                </body>

                </html>