1 <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="100%" height="100%"
2 codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" id="swf">
3 <param name="movie" value="1.swf">
4 <param name="quality" value="high">
5 <param name="bgcolor" value="#F0F0F0">
6 <param name="menu" value="false">
7 <param name="wmode" value="opaque">
8 <param name="FlashVars" value="">
9 <param name="allowScriptAccess" value="sameDomain">
10 <param name="loop" value="false">
11 <param name="play" value=""false"">
12 <embed name="swf" src="1.swf"
13 width="100%" height="100%"
14 align="middle"
15 quality="high"
16 menu="false"
17 play="false"
18 loop="false"
19 FlashVars=""
20 wmode="opaque"
21 allowScriptAccess="sameDomain"
22 type="application/x-shockwave-flash"
23 pluginspage="http://www.adobe.com/go/getflashplayer">
24 </embed>
25 </object>
参数介绍:
calssid-设置浏览器的Activex控件,仅用于OBJECT标签。
codebase-设置flash Activex控件的位置,因而如果浏览器如果没有安装的话,可以自动下载安装。仅用于OBJECT标签。
width-以百分比或象素指定flash影片的宽度。
height-以百分比或象素指定flash影片的高度.
src-指定影片的下载地址。仅用于EMBED标签。
pluginspage-设置flash 插件的位置,因而如果浏览器如果没有安装的话,可以自动下载安装。仅用于EMBED标签。
movie-指定影片的下载地址。仅用于OBJECT标签。
id-设定变量名,用于脚本代码的引用。仅用于OBJECT。
name -设定变量名,用于脚本代码(如javascript)的引用。仅用于EMBED。
SWLIVECONNECT - (true或false)指定当flash player第一次下载时,是否启用java。如果些属性省略,默认值为false。你果你在相同页同使用javascript和flash,java必须使用FSCommand来工作。
PLAY -(true或false)指定flash影片是否在下载完成后就自动播放,如果省略此属性,则默认为true。
LOOP - (true或false)指定影片播放完最后一帧后是停止还是继续循环播放,如果省略此属性,则默认为true。
MENU - (true或false)
True 显示全部的菜单,允许用户放大,缩小等控制影片播放等操作。
False 显示只包含设置选项和关于flash的菜单。
QUALITY - (low, high, autolow, autohigh, best )
Low 速度优于美观,而且不应用反锯齿。
·Autolow 刚开始着重于速度,但当需要时随时提升美观。
·Autohigh 同时着重播放速度和美观,但需要时则牺牲美观来保证播放速度。
·Medium 应用一些反锯齿而不平滑位图。它质量高于low设置而低于high设置。
·High 美观优于播放速度,而且一直应用反锯齿。如果影片不包含动画,位图会被平滑化;而如果影片包含动画,位图将不变平滑。
·Best 提供最好的显示质量而不考虑播放速度。所有输出都应用反锯齿及所有位图都被平滑化。
·SCALE - (showall, noborder, exactfit)
·Default(Show all)影片在指定的区域内显示,但保持原始的比例。影片两侧将会出现边框。
·No Boder 收缩影片以适合指定的区域,保持影片不失真,但部分影片将可能将裁切。然而保持影片的原始比例。
·Exact Fit 使整个影片在指定的区域内显示,影片有可能变形失真,而且不保持原始的比例。
·ALIGN - (l, t, r, b)
·默认为居中,当浏览器窗口小于影片时,边缘会被裁切。
·Left,Right,Top,Bottom按照相应的设置沿浏览器的边缘对齐。如果需要,另外三边将被裁切。
·SALIGN - (l, t, r, b, tl, tr, bl, br)
·L,R,T,B
·TL,TR
·BL,BR
·wmode- (window, opaque, transparent) 设置flash影片的window mode属性,指定flash在浏览器中的透明,层叠及位置。
·window 影片在浏览器中自己的矩形窗口内播放。
·opaque 影片隐藏了所有在它后面的内容。(可以处理flash遮住html元素.)
·transparent 使flash影片透明,显示透明影片后面的网页内容。这将会降低动画的性能。而且这个属性不是在所有浏览器中都可用的。
·BGCOLOR - (#RRGGBB, 十六进制RGB值。)指定影片的背景颜色。使用这个属性覆盖flash中设定的背景颜色。
·BASE - 设定基准目录或URL,用来解决所以flash中的相对路径。类似网页中的<base>标签。
·FLASHVARS 传递变量到flash player,需要flash player6及以后的版本。
·传递root级变量到影片。字符串的格式是用“&”分隔的name=value集。
1 <input type="button" value="播放SWF" id="playSWF">
2 <script type="text/javascript">
3 var btn=document.getElementById("playSWF");
4 btn.onclick=function(){
5 document.swf.Play();
6 }
7 </script>
下面是JS控制flash的一些方法:
Play() ---------------------------------------- 播放动画
StopPlay()------------------------------------停止动画
IsPlaying()----------------------------------- 动画是否正在播放
GotoFrame(frame_number)---------------- 跳转到某帧
TotalFrames()------------------------------- 获取动画总帧数
CurrentFrame()------------------------------回传当前动画所在帧数-1
Rewind()-------------------------------------使动画返回第一帧
SetZoomRect(left,top,right,buttom)-------放大指定区域
Zoom(percent)------------------------------改变动画大小
Pan(x_position,y_position,unit)------------使动画在x,y方向上平移
PercentLoaded()----------------------------返回动画被载入的百分比
LoadMovie(level_number,path)----------- 加载动画
TGotoFrame(movie_clip,frame_number)- movie_clip跳转到指定帧数
TGotoLabel(movie_clip,label_name)------ movie_clip跳转到指定标签
TCurrentFrame(movie_clip)--------------- 回传movie_clip当前帧-1
TCurrentLabel(movie_clip)-----------------回传movie_clip当前标签
TPlay(movie_clip)---------------------------播放movie_clip
TStopPlay(movie_clip)----------------------停止movie_clip的播放
GetVariable(variable_name)-----------------获取变量
SetVariable(variable_name,value)-----------变量赋值
TCallFrame(movie_clip,frame_number)---call指定帧上的action
TCallLabel(movie_clip,label)----------------call指定标签上的action
TGetProperty(movie_clip,property)--------获取movie_clip的指定属性
TSetProperty(movie_clip,property,number)-设置movie_clip的指定属性
其中TGetProperty 和 TSetProperty 的属性是使用数字0-18来获取的,下面是各数字代表的属性:
属性 作用 数字 使用方式
X Position X坐标 0 Get,Set
Y Position Y坐标 1 Get,Set
X Scale X方向缩放比率 2 Get,Set
Y Scale Y方向缩放比率 3 Get,Set
CurrentFrame movie_clip当前所在帧数 4 Get
TotalFrames movie_clip总帧数 5 Get
Alpha movie_clip的透明度 6 Get,Set
Visibility movie_clip是否可见 7 Get,Set
Width movie_clip的宽度 8 Get
Height movie_clip的高度 9 Get
Rotation movie_clip的旋转度 10 Get,Set
Target movie_clip的路径 11 Get
Framesloaded movie_clip已载入的帧数 12 Get
Name movie_clip的实体名字 13 Get,Set
DropTarget movie_clip的拖拽 14 Get
Url 包含movie_clip的动画的url 15 Get
HighQuality 设置画面质量为高质量 16 Get,Set
FocusRect 显示按钮边框 17 Get,Set
SoundBufTime 预设声音缓冲时间 18 Get,Set
flash调用js:
可以使用fscommand来调用js,但使用getUrl方面更为的方便,比如:getURL("BLOCKED SCRIPTalert('" message "')");就可以使用js的alert的方法作为调试使用.
根据以上情况对flash使用做简单的封装.
player.js:
1 (function($){
2 var defaults={
3 src:"",
4 id:"flashId",
5 width:"100%",
6 height:"100%"
7 }
8 function getHtml(param){
9 var html='<object id="' param.id '" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="' param.width '" height="' param.height '" ';
10 html =' codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0">';
11 html ='<param name="movie" value="' param.url '">';
12 html ='<param name="quality" value="high">';
13 html ='<param name="bgcolor" value="#F0F0F0">';
14 html ='<param name="menu" value="false">';
15 html ='<param name="wmode" value="opaque">';
16 html ='<param name="FlashVars" value="">';
17 html ='<param name="allowScriptAccess" value="sameDomain">';
18 html ='<param name="loop" value="false">';
19 html ='<param name="play" value=""false"">';
20 html ='<embed name="swf" src="' param.url '" ';
21 html =' width="' param.width '" height="' param.height '" ';
22 html =' align="middle" ';
23 html =' quality="high" ';
24 html =' menu="false" ';
25 html =' play="false" ';
26 html =' loop="false" ';
27 html =' FlashVars="" ';
28 html =' wmode="opaque" ';
29 html =' allowScriptAccess="sameDomain" ';
30 html =' type="application/x-shockwave-flash" ';
31 html =' pluginspage="http://www.adobe.com/go/getflashplayer">';
32 html ='</embed>';
33 html ='</object>';
34
35 html ='<div class="playBtn"></div>';
36 html ='<div class="playBar">';
37 html ='<p class="currentAddress"></p>';
38 html ='</div>';
39 return html;
40 }
41 function getTimer(obj){
42 var total=obj.TotalFrames();
43 var current=obj.CurrentFrame();
44 return current/total*100;
45 }
46
47
48 $.fn.player=function(opts){
49 opts=$.extend({},defaults,opts);
50 this.each(function(){
51 var play=false;
52 var obj=$(this);
53 var timer=null;
54 obj.addClass("playerBox").html(getHtml(opts));
55 $(".playBtn",obj).click(function(){
56 play=!play;
57 console.log(document[opts.id])
58 if(play){
59 $("embed",obj).get(0).Play();
60 timer=setInterval(function(){
61 $(".currentAddress",obj).css("width",getTimer($("embed",obj).get(0)) "%");
62 },20);
63
64 }else{
65 $("embed",obj).get(0).StopPlay();
66 clearInterval(timer);
67 }
68 });
69 });
70 }
71
72 })(jQuery);
player.css
1 @charset "utf-8";
2 .playerBox{
3 position:relative;
4 }
5 .playerBox .playBar,
6 .playerBox .playBtn{
7 display:none;
8 }
9 .playerBox:hover .playBar,
10 .playerBox:hover .playBtn{
11 display:block;
12 }
13 .playerBox .playBtn{
14 width:50px;
15 height:50px;
16 background-image:url(playbtn.png);
17 background-repeat:no-repeat;
18 position:absolute;
19 margin-left:-25px;
20 margin-top:-25px;
21 cursor:pointer;
22 top:50%;
23 left:50%;
24 }
25 .playerBox .playBar{
26 position:absolute;
27 bottom:10px;
28 box-shadow:0px -1px 3px yellow;
29 border:1px solid #ccc;
30 height:10px;
31 left:5px;
32 background-color:#dcdcdc;
33 right:5px;
34 border-radius:5px;
35 cursor:pointer;
36 }
37 .playerBox .currentAddress{
38 padding:0;
39 margin:0;
40 height:10px;
41 background-color:#6c6d6e;
42 width:50%;
43 }
index.html:
1 <!doctype html>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <title>封装flash</title>
6 <link rel="stylesheet" type="text/css" href="player.css" />
7 <script type="text/javascript" src="jquery-1.11.1.js"></script>
8 <script type="text/javascript" src="player.js"></script>
9
10 </head>
11
12 <body>
13 <div class="test" style="width:500px;height:400px;"></div>
14 <script type="text/javascript">
15 $(function(){
16 $(".test").player({id:"gysId",url:"1.swf"});
17 });
18
19 </script>
20
21
22 </body>
23 </html>
后补:今天发现,原来这些工作都是有这个插件做了,我还在傻逼逼的封装.
http://jquery.thewikies.com/swfobject/examples