Question

我有一个嵌入在html页面上的SWF对象。我只是想把对象放在屏幕上。我已经尝试了一百种不同的东西（将对象上的对齐属性设置为居中，将对象包裹在div中并使其居中......）但是对象始终与屏幕左侧齐平。我确信这是一个非常简单的代码行，可以使这个工作，请告诉我这是什么...

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当我尝试编辑使用SWF生成的html文件时，这是我的问题。当我尝试创建一个新的HTML文件并在其中嵌入swf时，我可以将文件居中，但我无法将其缩放到适合屏幕垂直尺寸的对象（页面底部的对象）在视图下方，而在自动生成的html文件中，swf自动缩放以适应屏幕，但我无法将其置于中心位置。）非常感谢这些问题的解决方案

Answer 1

以下是jsFidle

中的示例

这很简单，您使用absolute位置，只需指定top和left的50％，然后将top和left的负边距设为容器。

这是css：

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

请记住，为此，您需要在窗口调整大小事件中使用固定大小或javascript更新边距！

以下是HTML标记：

<div class="container">
    <iframe width="400" height="400" src="http://www.youtube.com/embed/Awlp8B5os0k" frameborder="0" allowfullscreen></iframe>
</div>

html页面上的中心swf对象

1 个答案: