2013-02-01 4 views
1

У меня есть объект SWF, который я встроил на html-странице. Я просто хочу центрировать объект на экране. Я пробовал сотню различных вещей (установка атрибутов align на объекте на центр, обертывание объекта в div и центрирование этого ...), но объект всегда отображается на одном уровне с левой стороной экрана. Я уверен, что его очень просто строка кода где-то, что будет делать эту работу, пожалуйста, просветить меня, что это такое ...Центр swf объект на html странице

This application was built using Adobe Flex, an open source framework 
for building rich Internet applications that get delivered via the 
Flash Player or to desktops via Adobe AIR. 

Learn more about Flex at http://flex.org 
// --><head> 
    <title></title> 
    <meta name="google" value="notranslate" />   
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 

    <style type="text/css" media="screen"> 
     html, body { height:100%; } 
     body { margin:0; padding:0; overflow:auto; text-align:center; background-  position:center; 
       background-color: #000000;} 
     object:focus { outline:none; } 
      #flashContent { display:; } 

</style> 

    <!-- Enable Browser History by replacing useBrowserHistory tokens with two hyphens --> 
    <!-- BEGIN Browser History required section --> 
    <link rel="stylesheet" type="text/css" href="history/history.css" /> 
    <script type="text/javascript" src="history/history.js"></script> 
    <!-- END Browser History required section --> 

    <script type="text/javascript" src="swfobject.js"></script> 
    <script type="text/javascript"> 
     // For version detection, set to min. required Flash Player version, or 0 (or 0.0.0), for no version detection. 
     var swfVersionStr = "10.2.0"; 
     // To use express install, set to playerProductInstall.swf, otherwise the empty string. 
     var xiSwfUrlStr = "playerProductInstall.swf"; 
     var flashvars = {}; 
     var params = {}; 
     params.quality = "high"; 
     params.bgcolor = "#000000"; 
     params.allowscriptaccess = "sameDomain"; 
     params.allowfullscreen = "true"; 
     var attributes = {}; 
     attributes.id = "Main"; 
     attributes.name = "Main"; 
     attributes.align = "middle"; 
     swfobject.embedSWF(
      "Main.swf", "flashContent", 
      "100%", "100%", 
      swfVersionStr, xiSwfUrlStr, 
      flashvars, params, attributes); 
     // JavaScript enabled so display the flashContent div in case it is not replaced with a swf object. 
     swfobject.createCSS("#flashContent", "display:block;text-align:center;"); 
    </script> 
</head> 
<body> 

    <div id="flashContent" align="center"> 
     <p> 
      To view this page ensure that Adobe Flash Player version 
      10.2.0 or greater is installed. 
     </p> 
     <script type="text/javascript"> 
      var pageHost = ((document.location.protocol == "https:") ? "https://" : "http://"); 
      document.write("<a href='http://www.adobe.com/go/getflashplayer'><img src='" 
          + pageHost + "www.adobe.com/images/shared/download_buttons/get_flash_player.gif' alt='Get Adobe Flash player' /></a>"); 
     </script> 
    </div> 

    <noscript> 
    <div align="center"> 
     <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%" align="middle" id="Main"> 
     <param name="movie" value="Main.swf" /> 
     <param name="quality" value="high" /> 
     <param name="bgcolor" value="#000000" /> 
     <param name="allowScriptAccess" value="sameDomain" /> 
     <param name="allowFullScreen" value="true" /> 
     <param name="wmode" value="opaque" /> 
     <!--[if !IE]>--> 
     <object data="Main.swf" type="application/x-shockwave-flash" width="100%" height="100%" align="middle"> 
      <param name="quality" value="high" /> 
      <param name="bgcolor" value="#000000" /> 
      <param name="allowScriptAccess" value="sameDomain" /> 
      <param name="allowFullScreen" value="true" /> 
      <param name="wmode" value="opaque" /> 
      <!--<![endif]--> 
      <!--[if gte IE 6]>--> 
      <p> 
      Either scripts and active content are not permitted to run or Adobe Flash Player version 
      10.2.0 or greater is not installed. 
      </p> 
      <!--<![endif]--> 
      <a href="http://www.adobe.com/go/getflashplayer"> 
      <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash Player" /> 
      </a> 
      <!--[if !IE]>--> 
      </object> 
     <!--<![endif]--> 
     </object> 
    </div> 
    </noscript>  
    </body> 
</html> 

PS это моя проблема, когда я пытаюсь изменить файл HTML генерируемый с SWF. Когда я пытаюсь создать новый HTML-файл и вставлять swf в него, я могу центрировать файл, но я не могу получить его объект для масштабирования, чтобы он соответствовал вертикальным размерам экрана (объекты внизу страницы находятся под представлением, тогда как в автоматически создаваемом html-файле swf автоматически масштабируется, чтобы соответствовать экрану, но я не могу сосредоточить его.) Решение любой из этих проблем было бы весьма полезно.

ответ

1

пример jsFidle

Это очень просто, вы используете absolute позицию и просто в специфицировать 50% от top и left, а затем положить top и left отрицательную маржу половину контейнера.

Вот CSS:

.container{ 
    width: 400px; 
    height: 400px; 
    position: absolute; 
    top: 50%; 
    left: 50%; 
    margin-left: -200px; 
    margin-top: -200px; 
    background-color: blue; 
} 

Remmeber для этой работы вам нужно либо фиксированный размер или Javascript обновление полей в окне изменения размера событие!

Вот HTML разметка:

<div class="container"> 
    <iframe width="400" height="400" src="http://www.youtube.com/embed/Awlp8B5os0k" frameborder="0" allowfullscreen></iframe> 
</div> 
Смежные вопросы