Question

我想在一个html页面上嵌入一个swf，就像一个浮动的视频观看面板。我已经有一个swf文件，它将根据浏览器大小自动调整其大小，并且swf文件是部分透明的。我想我可以添加一个div标签，使位置绝对并更改z-index更大，但这不起作用因为swf刚刚替换了页面上的所有内容。

这就是我做的事情

<script>
      swfobject.embedSWF("swf/float.swf", "header", "100%", "100%", "9.0.0");
</script>

<body bgcolor="#000000">
      <div id="header"></div>
      <div id="shell">
          things in my html
      </div>
</body>

#header {
    position:absolute;
    z-index:100;

}

有什么想法吗？感谢。

Answer 1

一旦你的尺寸正常工作，你需要将 wmode 设置为透明，以便能够看到闪光灯背后的内容，如果你不这样做的话背景将是不透明的。

这是来自swfobject docs的快速复制品，但它应该明白：

<script type="text/javascript">

var flashvars = {};
var params = {wmode : "transparent"};
var attributes = {};

swfobject.embedSWF("myContent.swf", "myContent", "300", "120", "9.0.0","expressInstall.swf", flashvars, params, attributes);

</script>

Answer 2

我认为这个问题是CSS与<object />标签不兼容。 swfobject.embedSWF将<div id="header"></div>转换为<object />标记，其中包含可能影响CSS的一堆属性。如果你在标题DIV周围创建一个包装器DIV并将CSS应用到包装器DIV，那么一切都会更好。您还需要在CSS中添加100％的宽度和高度。以下是修改后的来源：

<script>
    swfobject.embedSWF("swf/float.swf", "header", "100%", "100%", "9.0.0");
</script>

<body bgcolor="#000000">
    <div id="wrapper">
        <div id="header"></div>
        </div>
    <div id="shell">
        things in my html
    </div>
</body>

#wrapper {
    position:absolute;
    z-index:100;
    width:100%;
    height:100%;
}

如何在HTML页面上嵌入swf？

2 个答案: