如何让 Flash 漂浮在网站上方？答案

【问题标题】：How to get flash to float above website?如何让 Flash 漂浮在网站上方？
【发布时间】：2012-03-20 09:47:39
【问题描述】：

我有一个 Flash 媒体播放器，我希望它漂浮在我们论坛的顶部，这样当用户向下滚动时，媒体播放器就会跟随。

我还没有找到一种方法让它位于 html 之上。它总是把它往下推。

你可以在http://www.gcehosting.com/stackoverflow看到我所说的媒体播放器

这是代码：

<!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>Music Player Widget - Preview 2</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <style type="text/css" media="screen">
        html, body { height:100%; background-color: #000000;}
        body { margin:0; padding:0; overflow:hidden; }
        #flashContent { width:100%; height:100%; }
        </style>
    </head>
    <body>

        <div id="flashContent">

            <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="100%" height="100%" id="main" align="middle">
                <param name="movie" value="main.swf" />
                <param name="quality" value="high" />
                <param name="bgcolor" value="#ffffff" />
                <param name="play" value="true" />
                <param name="loop" value="true" />
                <param name="wmode" value="transparent" />
                <param name="scale" value="showall" />
                <param name="menu" value="true" />
                <param name="devicefont" value="false" />
                <param name="salign" value="" />
                <param name="allowScriptAccess" value="sameDomain" />

                <!--[if !IE]>-->
                <object type="application/x-shockwave-flash" data="main.swf" width="100%" height="100%">
                    <param name="movie" value="main.swf" />
                    <param name="quality" value="high" />
                    <param name="bgcolor" value="#ffffff" />
                    <param name="play" value="true" />
                    <param name="loop" value="true" />
                    <param name="wmode" value="transparent" />
                    <param name="scale" value="showall" />
                    <param name="menu" value="true" />
                    <param name="devicefont" value="false" />
                    <param name="salign" value="" />
                    <param name="allowScriptAccess" value="sameDomain" />
                <!--<![endif]-->
                    <a href="http://www.adobe.com/go/getflash">
                        <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>

    </body>
</html>

我希望有人能够提供解决方案

【问题讨论】：

欢迎来到Stack Overflow。请花一些时间查看faq。

标签： html css flash layout

【解决方案1】：

您可以将wmode 参数设置为transparent，这会使SWF 的所有非对象区域透明。然后使用绝对 CSS 定位将其置于网页中的任何位置。

来自this tutorial的相关代码sn-ps：

#wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 900;
  height: 900;
  z-index: 1;
}

<div id="wrapper">
  <object>
    <param name="movie" value="dummy.swf">
    <param name="wmode" value="transparent">
    <embed src="dummy.swf" wmode="transparent">
  </object>
</div>

【讨论】：

请问您为什么不推荐它？
google for flash wmode bug => 例如xebee.xebia.in/2010/08/29/…
“紧随其后的透明闪光”立即让我想起了在我想阅读或点击链接时妨碍我的烦人广告。你将它用于不同的目的，所以没关系。我的错。
我讨厌 Flash 广告。我不会在我的 7 个网站中的任何一个上放一个广告。甚至没有我的免费虚拟主机网站。我宁愿不赚钱也不愿在那里有那些侵入性的东西

【解决方案2】：

在#flashContent 上使用position:fixed，将其设置为right:0，并确保宽度/高度不覆盖论坛。

【讨论】：

好的，我明白你在说什么。那么宽度/高度我该怎么做呢？
不知道，显示 Flash 内容所需的宽度/高度是多少。也许大约 200px 宽度？
问题是：如果我将其保留为 100x100，您将无法点击论坛上的任何内容。如果我将其更改为 30%，那么玩家最终会出现在页面的左侧......
如果你得到了我提供的网址，虽然这是一个测试并且是 iframe 论坛，但我可以正确显示它，我在论坛上进行了现场测试并得到了相同的结果