好的开源工具 swfobject--让我们容易的在网页嵌入flash，并且兼容性强和利于seo

swfobject是什么？

它是一个开源的javascript工具类，我们可以在google code上很容易的找到它：http://code.google.com/p/swfobject/。它提供了一个统一的方式让我们很轻松的在网页中嵌入flash内容，而不用去考虑任何平台和浏览器的特殊标记，及它们对flash的支持能力。无论你是页面制作、flash制作或者js的开发，你都可以找到一个适合的方式嵌入flash内容。其次，它还提供了一些API，让你能够去检测当前浏览器对flash支持的一些信息，让你可以轻松的完成你的逻辑。据官方说文件只有10kb，gzip之后只有3.9K。

如何用swfobject在页面中嵌入flash?

它提供了两种方法：静态嵌入方法和动态的嵌入。

静态嵌入：它利用html标记嵌入flash内容和替代内容，然后选用js实现标记所不能完成的检测、兼容和动态替换等功能。

<!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>SWFObject - step 3</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

</head>
  <body>
    <div>

<p>Alternative content</p>

</object>

</object>

  </div>
  </body>
</html>

上段代码是直接从官方文档处引来的，总的来说这种方式的嵌入分为三步：

1，利用html嵌入flash和替代内容，其中紫色代码处就是。我们可以看到最外围的object标签，这是针对IE的，我们通过param标记来指定它的一些参数，内容的object标签是对其它浏览器的，这里也要指定flash的地址，并且还有一个<P>标记的替代内容，这是该js工具的一个亮点，首先，它可以在如果浏览器不支持flash的情况下，显示这里的内容，保证你的页面在任何情况下都是完整的，并且是可控制的，第二，我们都知道搜索引擎是不能索引flash内的内容的，我们在替代内容加入你想要索引的内容，这样更利于SEO。

2，引入该js文件，蓝色代码处。

3，红色代码处，告诉js你要让它帮你完成兼容等工作的标记，第一个参数是标记object的ID，第二个是你要求的flash的版本号，是按major.minor.release.build这样的形式，js只管前三个，如果是只要是第9个大版本就行，用9而不是9.0.0。第三个参数可选，它显示的是如果版本不支持，去下载特定版本时显示的flash内容，该方案里包含了一个flash，当然你也可以自定义。其实，还有一个可选的参数，传一个回调函数，不管是载入完成时调用的，无论成功或失败都会调用的。

你可以重复1、3处的代码来嵌入更多的flash内容。

动态嵌入：这种只需要你加入替代的内容，然后js会帮你完成flash的嵌入（当前浏览器支持并没有禁用js，flash也处于可用状态的情况下）。

<!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>SWFObject dynamic embed - step 3</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

</head>
  <body>

<div id="myContent"> <p>Alternative content</p> </div>

  </body>
</html>

第一步，紫色代码处，只是替代内容。

第二步，引入js，蓝色代码处。

第三步，调用。第一个参数，嵌入的flash内容，第二个参数替代内容的ID，第三、四个flash的宽、高，第五个要求的版本号，第6个可选，去下载时的显示的动画，第7个可选要加入实际的flash的flashvars参数，第8个可选，要加入的params参数，第9个可选要加入的object的属性参数，第10个可选，回调函数。

其中7、8、9参数可以

var flashvars = {};
flashvars.name1 = "hello";
flashvars.name2 = "world";
flashvars.name3 = "foobar";

var params = {};
params.menu = "false";

var attributes = {};
attributes.id = "myDynamicContent";
attributes.name = "myDynamicContent";

这样的形式出现，当然你也可以传个{}过去，更详细的介绍还是去google code吧。

这里只是描述了嵌入flash的简单的方法，但是swfobject的功能绝不仅如此，它提供的其它api可以让你轻易的实现选择性嵌入等等。

posted @ 2011-07-24 11:01 for certain 阅读(557) 评论(0) 编辑收藏举报

刷新页面返回顶部

好的开源工具 swfobject--让我们容易的在网页嵌入flash，并且兼容性强和利于seo

公告