Question

是否有任何方式提供备用GIF / PNG图像，以防用户未安装和/或停用Adobe Flash。我找到了一些建议，比如W3C中的以下内容，它通过JavaScript确定客户端上是否存在Adobe Flash：W3C Providing alternative images

老实说，我更喜欢非JS 技术。我在考虑一些XHTML标记，相当于<noscript>。（如<noobject>，如果无法显示/加载对象（在我们的例子中为Flash）。

需要这种分离的原因如下：我正在为之工作的银行最好以Flash格式显示他们的横幅。如果不可能显示简单的图像。在过去，它很可能以前面提到的方式解决。我们目前正在进行设计更新，而我偶然发现了这段代码，这让我想知道它是否真的是最优雅和兼容的方式。

让我印象深刻的另一个想法：实际上是否可以在禁用JavaScript的环境中加载Flash对象？

Answer 1

实际安装了闪存但javascript关闭是一个有效的方案。这适用于大多数浏览器：

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="800" height="600" id="flashContent">
  <param name="movie" value="flash.swf" />
  <!--[if !IE]>-->
    <object type="application/x-shockwave-flash" data="flash.swf" width="800" height="600">
  <!--<![endif]-->
      <img src="(...)" alt="Put your alternate content here" />
  <!--[if !IE]>-->
    </object>
  <!--<![endif]-->
</object>

Answer 2

我使用以下代码进行优雅降级。效果很好。

<!--[if !IE]> -->
<object type="application/x-shockwave-flash" data="flash.swf" width="500" height="100">
<!-- <![endif]-->

<!--[if IE]>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" 
    codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" 
    width="500" height="100">
  <param name="movie" value="flash.swf" />
<!--><!--dgx-->
  <param name="loop" value="false">
  <param name="menu" value="false">
  <param name="quality" value="high">
  <img src="flash_replacement.png" width="500" height="100" alt="No Flash">
</object>
<!-- <![endif]-->

Answer 3

我不知道你为什么要避免使用javascript，这是处理Flash时的最佳解决方案。

使用SWFObjects Library（目前为止最知名的）你可以这样做：

<!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"> 
<head> 
 <title> My Home Page </title> 
 <meta name="viewport" content="width=780"> 
 <script type="text/javascript" src="swfobject.js"></script> 
</head> 
<body> 
 <div id="splashintro"> 
   <a href="more.html"><img src="splash_noflash.png" /></a> 
 </div>
 <script type="text/javascript"> 
   var so = new SWFObject("csplash.swf", "my_intro", "300", "240", "8", "#338899"); 
   so.write("splashintro"); 
 </script> 
 </body> 
</html>

脚本的作用是将 splashintro div替换为flash文件，如果浏览器不支持Flash，则不执行任何操作， splash_noflash.png 将会显示

P.S。借助这项技术，您可以为iPhone做好准备，而不是显示蓝色立方体，它会显示图像：）

Answer 4

我发现使用内联样式来完成这个技巧。

例如：

<div style="background-image: url('...');">
    <object>
     /* Embedded Flash */
    </object>
</div>

Answer 5

如果用户没有安装和/或停用Adobe Flash，我们可以提供备用GIF / PNG图像。

<object id="flashcontent classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="550px" height="400px">
<param name="movie" value="mymovie.swf" />

<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="mymovie.swf" width="550px" height="400px">
<!--<![endif]-->

<p>
Fallback or 'alternate' content goes here.
This content will only be visible if the SWF fails to load.
</p>

<!--[if !IE]>-->
</object>
<!--<![endif]-->

</object>

并添加此内容......

<script type="text/javascript">
swfobject.registerObject("flashcontent", "9", "/path/to/expressinstall.swf");   
</script>

Answer 6

我已经在CSS中编写了一个简单的方法 - 根本没有额外的JavaScript。

为Flash影片所在的ID / Class命名并使用背景图像。将Flash电影包裹在该div中。

例如：

<div ID="MyFlashMovie"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="800" height="600" id="flashContent">
  <param name="movie" value="flashMovie.swf" />... etc., etc.</object>
</div> etc.

然后在你的CSS中：

#MyFlashMovie {
background: url("alternateGraphic.png");
background-repeat: no-repeat;
height: XXpx;
width: XXpx;
}

当闪光灯不可用时，例如在iphone / pad上，将显示图形。我发现，唯一的缺点就是如果你的Flash电影使用透明背景，你会看到通过转换的alt图形。只需在Flash影片中将纯色作为最低层（确保它与网站的颜色相同），它看起来会很好。

〜GreaseJunkie

如果没有Adobe Flash，则提供替代图像

6 个答案: