那么针对“SWFObject基本用法实例分析”的攻略,我会从以下几个方面着手进行详细讲解:
- SWFObject基本介绍
- SWFObject的引入
- SWFObject的基本用法
- 实例分析
- 结束语
接下来会一步步讲解,希望对您有所帮助。
1. SWFObject基本介绍
SWFObject是一个用于嵌入Flash对象的JavaScript库,使用SWFObject可以避免因为浏览器差异导致Flash在某些浏览器上无法正常显示的问题。SWFObject是一种呈现对象的HTML和Flash替代方案,不仅能够为Flash提供交互行为,而且可以扩展通用的DOM API,使得有机会编写更智能的JavaScript代码。
2. SWFObject的引入
SWFObject是一个JavaScript库,我们可以通过以下方式将它引入到我们的网页中:
<script src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
3. SWFObject的基本用法
SWFObject的基本用法大致分为以下三步:
- 创建Flash对象的容器
- 配置Flash对象的参数
- 嵌入Flash对象
我们可以通过如下代码创建Flash对象的容器:
<div id="flashContent"></div>
接下来我们需要通过JS进行配置,代码如下:
var flashvars = {};
var params = {};
params.quality = "high";
params.bgcolor = "#f0f0f0";
params.allowscriptaccess = "sameDomain";
params.allowfullscreen = "true";
// 如果没有flash插件,使用swfObject来替代
params.useExpressInstall = true;
var attributes = {};
attributes.id = "myId";
attributes.name = "myId";
attributes.align = "left";
swfobject.embedSWF("myContent.swf", "flashContent", "100%", "100%", "9.0.0", "expressInstall.swf", flashvars, params, attributes);
以上代码的含义如下:
flashvars
是传递给Flash文件的变量,以属性/值对的形式表示。params
是Flash对象的参数,例如影片质量,背景颜色等等。attributes
是Flash对象标签的属性,例如id、name、align等等。swfobject.embedSWF
则是将Flash对象嵌入到容器“flashContent”中的关键步骤。其中参数分别为Flash文件路径、容器ID、宽度、高度、最低Flash版本、Flash检测文件、Flash变量、Flash参数、Flash属性。
4. 实例分析
下面我们来看两个具体的实例:
实例1:简单嵌入Flash
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>嵌入Flash示例1</title>
<script src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
</head>
<body>
<div id="flashContainer"></div>
<script>
var flashvars = {};
var params = {};
params.quality = "high";
params.bgcolor = "#ffffff";
params.allowscriptaccess = "sameDomain";
params.allowfullscreen = "true";
var swfVersionStr = "11.0.0";
var swfUrlStr = "flash/movie.swf";
swfobject.embedSWF(swfUrlStr, "flashContainer", "550", "400", swfVersionStr, "", flashvars, params);
</script>
</body>
</html>
在浏览器中打开上面的代码,就可以看到一个简单的Flash动画。
实例2:使用ExpressInstall替代
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>嵌入Flash示例2</title>
<script src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
</head>
<body>
<div id="flashContainer"></div>
<script>
var flashvars = {};
var params = {};
params.quality = "high";
params.bgcolor = "#ffffff";
params.allowscriptaccess = "sameDomain";
params.allowfullscreen = "true";
// 如果没有flash插件,使用swfObject来替代
params.useExpressInstall = true;
var swfVersionStr = "11.0.0";
var swfUrlStr = "flash/movie.swf";
swfobject.embedSWF(swfUrlStr, "flashContainer", "550", "400", swfVersionStr, "", flashvars, params);
</script>
</body>
</html>
以上代码中,我们增加了一个参数params.useExpressInstall = true
。如果用户没有安装Flash插件,这个参数会调用ExpressInstall.swf文件来引导用户下载并安装Flash插件,而不会留下空白的动画。
5. 结束语
到此,我们就讲完了“SWFObject基本用法实例分析”的完整攻略。在实际开发中,SWFObject可以帮助我们避免Flash在不同浏览器中的兼容性问题,提高网站的用户体验。希望以上内容对您有所帮助,谢谢!
本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:SWFObject基本用法实例分析 - Python技术站