当前位置: 王朝网络 >> other >> flash影片web播放控制器制作祥解

flash影片web播放控制器制作祥解

王朝other·作者佚名 2006-11-24

在闪吧看到了这个flash播放器，想下载其源码下来研究已供自己使用，没想到闪吧已做禁止下载功能。费了几天的网上搜索，除了几篇相关资料外，没有源码下载，更没有实例讲解。受不住诱惑，只好自己参考资料亲手写了。这个flash影片播放控制器时用了闪吧的播放界面，程序代码完全亲手写上。

首先我们看看flash播放控制器的界面（很简单的html代码，不过不是自己源创的）定义样式：

<style>

body,td,button{font:normal 12px Tahoma;color:#333333;text-align:center}

.drag{position:relative;cursor:hand}

button{border:1px solid #333333;background:#EEEEEE;margin:2px;font-family:Webdings;height:20px}

div{cursor:default}

#menu{margin:3;line-height:20px;border:1px solid #dedede;background:#FFFFFF;display:none;position:absolute}

#menu a:link,a:visited{border:1px solid #FFFFFF;background:#FFFFFF;text-decoration:none;display:block;padding:0 3;margin:1;color:#333333;cursor:default;text-align:left;text-indent:15px}

#menu a:hover{background:#dedede;border-color:#666666;color:#000000}

#ctlButtons IMG{behavior:url(rollover.htc)}

</style>引用驱动程序：

</object>

</td></tr></table>

<tr>

<tr>

</td>

<tr>

</table>

</td>

</tr>

</table>

<a href="打开指定URL" onClick="OpenRemoteSwf();return false">打开指定URL</a>

<a href="选择本地文件" onClick="selectMovie();return false">选择本地文件</a>

<a href="选择本地文件" onClick="alert(''''''''Wren FLash Player 1.0 Preview\nCopyright (C) WRen.Cn'''''''');return false">关于Wren Flash Player</a>

</div></div> 运行播放器的驱动程序：

var movie=document.getElementById("movie");

loadSWF("http://down.wren.cn/flash/navigation_68.swf","600","400"); //loadSWF("flash地址","宽度","高度")

</script>

下面看看我写的驱动程序代码，保存为play.js：

var total;//定义flash影片总桢数

var frame_number;//定义flash影片当前桢数

//以下是滚动条图片拖动程序

var dragapproved=false;

var z,x,y

//移动函数

function move(){

if (event.button==1&&dragapproved){

y=temp1+event.clientX-x;

//以下是控制移动的范围

if(y<0)

y=0;

if(y>420)

y=420;

z.style.pixelLeft=y

movie.GotoFrame(y/420*total);//移动到某一位置，flash影片播放到某个位置

return false

}

//获得拖动前初始数据的函数

function drags(){

if (!document.all)

return

if (event.srcElement.className=="drag"){

dragapproved=true

z=event.srcElement

temp1=z.style.pixelLeft

x=event.clientX

document.onmousemove=move

}

//动态显示播放影片的当前桢/总桢数

function showcount(){

frame_number=movie.CurrentFrame();

frame_number++;

frameCount.innerText=frame_number+"/"+movie.TotalFrames;

element.style.pixelLeft=420*(frame_number/movie.TotalFrames);//滚动条图片随之到相应的位置

if(frame_number==movie.TotalFrames)

clearTimeout(tn_ID);

else

var tn_ID=setTimeout(''''''''showcount();'''''''',1000);

}

//使影片返回第一帧

function Rewind(){

if(movie.IsPlaying()){

Pause();

}

movie.Rewind();

element.style.pixelLeft=0;

frameCount.innerText="1/"+total;

}

//播放影片

function Play(){

movie.Play();

showcount();

}

//暂停播放

function Pause(){

movie.StopPlay();

}

//跳至最末帧

function GoToEnd(){

if(movie.IsPlaying())

Pause();

movie.GotoFrame(total);

element.style.pixelLeft=420;

frameCount.innerText=total+"/"+total;

}

//快退影片

function Back()

{

if(movie.IsPlaying())

Pause();

frame_number=frame_number-50;

movie.GotoFrame(frame_number);

Play();

}

//快进影片

function Forward()

{

if(movie.IsPlaying())

Pause();

frame_number=frame_number+50;

movie.GotoFrame(frame_number);

Play();

}

//重新播放影片

function Replay(){

if(movie.IsPlaying()){

Pause();

movie.Rewind();

Play();

}

else

{

movie.Rewind();

Play();

}

//停止播放影片返回到第一桢

function Stop(){

if(movie.IsPlaying()){

Pause();

movie.Rewind();

}

else

{

movie.Rewind();

}

//显示影片载入进度，完全载入后控制按钮可用

function jindu(){

var in_ID;

bar.style.width=Math.round(movie.PercentLoaded())+"%";

frameCount.innerText=Math.round(movie.PercentLoaded())+"%";

if(movie.PercentLoaded() == 100){

ctlButtons.document.all.tags(''''''''IMG'''''''')[0].disabled=false;

ctlButtons.document.all.tags(''''''''IMG'''''''')[1].disabled=false;

ctlButtons.document.all.tags(''''''''IMG'''''''')[2].disabled=false;

ctlButtons.document.all.tags(''''''''IMG'''''''')[3].disabled=false;

ctlButtons.document.all.tags(''''''''IMG'''''''')[4].disabled=false;

ctlButtons.document.all.tags(''''''''IMG'''''''')[5].disabled=false;

ctlButtons.document.all.tags(''''''''IMG'''''''')[6].disabled=false;

ctlButtons.document.all.tags(''''''''IMG'''''''')[7].disabled=false;

ctlButtons.document.all.tags(''''''''IMG'''''''')[8].disabled=false;

total=movie.TotalFrames;

frame_number++;

frameCount.innerText=frame_number+"/"+total;

bar.style.background="";

//bar.style.width="0%"

bar.innerHTML=''''''''<img src="images/button/posbar1.gif" style="cursor:hand;border:0;" id="element" class="drag" OnMouseOver="fnOnMouseOver()" OnMouseOut="fnOnMouseOut()">'''''''';

document.onmousedown=drags

document.onmouseup=new Function("dragapproved=false;Play()")

showcount();

clearTimeout(in_ID);

}

else

in_ID=setTimeout("jindu();",1000);

}

//开始载入flash影片，载入过程中，播放控制按钮不可用

function loadSWF(fsrc,fwidth,fheight){

movie.LoadMovie(0, fsrc);

movie.width=fwidth;