1

我有一个嵌入在 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 自动缩放以适应屏幕,但我无法将其居中..) 将不胜感激这些问题的解决方案

4

1 回答 1

1

这是jsFidle中的一个示例

这很简单,您使用absoluteposition 并指定 50% fromtop然后leftputtopleft负边距一半的容器。

这是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>
于 2013-02-02T00:04:58.467 回答