网站首页站长博客下载中心域名交易站长论坛域名主机免费电邮免费域名中文排行排名查询站长书库书籍教程下载
设为首页
加入收藏
总编信箱
投稿或申请专栏请先 [登 陆]
学院首页 网络编程 网页设计 图形图象 数 据 库 服 务 器 网络媒体 网络安全 个人专栏 站长CLUB 业界新闻 信息公告
 当前位置:首页 >> 个人专栏 >> 谱乐专栏 >> 正文
公告通知
返回上级列表
资料搜索
相关文章
网页播放技术的实战解析
网页播放器进阶学习之制作篇(2)
[ 来源:中国站长学院 | 作者:aboutplayer | 时间:2005-5-28 20:18:11 | 浏览:人次 ]
收藏到新浪ViVi 收藏到365KEY 收藏到我摘  字号选择〖    〗/ 双击滚屏 单击停止  

    在简单网页播放器的基础上,在网页上,如何实现对“播放器”的控制呢。下面谱乐给大家举一个例子。

    全屏的功能其实只能在播放的状态下才能实现。此例中,若播放的是音频文件,视频区域出现的将是 WMP 本身附带的动态图纹,也可全屏,但显示器配置不好时,容易长时间黑屏,这时的你要等待,只到全屏动态图纹的出现。这告诉我们,只有在播放真正的视频媒体时,全屏效果才是最佳的。另外还有一个窍门:播放 WMP 类视频媒体“正在播放”状态时,不管你设置与否全屏功能,只要在视频区域双击鼠标,就可实现全屏播放,再双击返回,或按“Esc”键返回。

    上例的代码如下:

<object classid="clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6" id="aboutplayer" width="320" height="300">
<param name="URL" value="http://www.xdydm.com/newsite/music1/musics/india/AVSEQ09.wmv">
<param name="rate" value="1">
<param name="balance" value="0">
<param name="currentPosition" value="0">
<param name="defaultFrame" value>
<param name="playCount" value="1">
<param name="autoStart" value="-1">
<param name="currentMarker" value="0">
<param name="invokeURLs" value="-1">
<param name="baseURL" value>
<param name="volume" value="60">
<param name="mute" value="0">
<param name="uiMode" value="full">
<param name="stretchToFit" value="0">
<param name="windowlessVideo" value="0">
<param name="enabled" value="-1">
<param name="enableContextMenu" value="-1">
<param name="fullScreen" value="0">
<param name="SAMIStyle" value>
<param name="SAMILang" value>
<param name="SAMIFilename" value>
<param name="captioningID" value>
<param name="enableErrorDialogs" value="0">
<param name="_cx" value="6482">
<param name="_cy" value="6350">
</object>
</p>
<input type=button value=mute onclick=aboutplayer.settings.mute=aboutplayer.settings.mute==true?false:true;time.innerText=aboutplayer.settings.mute==true?'静音':'关闭静音';>
<input type=button value=play onclick=aboutplayer.controls.play();time.innerText='播放';>
<input type=button value=pause onclick=aboutplayer.controls.pause();time.innerText='暂停';>
<input type=button value=stop onclick=aboutplayer.controls.stop();time.innerText='停止';>
<input type=button value=mode onclick=aboutplayer.settings.balance=aboutplayer.settings.balance=='100'?'-100':'100';time.innerText=aboutplayer.settings.balance=='100'?'右声道':'左声道';>
<br>
<input type=button value=vol++ onclick=volup();>
<input type=button value=vol-- onclick=voldown();>
<input type=button value=fullscreen onclick="if(aboutplayer.playState==3)aboutplayer.fullscreen=1;">
<div id="time" style="background:#f2f3f7;width:245">Loading …</div>
<table style="width:245;height:10px;border:1px black solid;">
<tr>
<td id=itcn bgcolor=#f70968 style="width:0"></td>
<td style="width:0"></td>
</tr>
</table>
<script language=javascript defer>
var volv=aboutplayer.settings.volume;
//注意下行的\'|\'
setInterval("if(aboutplayer.playState==3){time.innerText=aboutplayer.controls.currentPositionString+\'|\'+ aboutplayer.currentMedia.durationString}",1000);
setInterval("if(aboutplayer.playState==3){itcn.style.width=parseInt(245*(aboutplayer.controls.currentPosition/aboutplayer.currentMedia.duration))}",1000);
function volup(){
if (volv<100){
volv+=5;
aboutplayer.settings.volume=volv;
time.innerText=volv;}
else{time.innerText='最大';}
}
function voldown(){
if (volv>0){
volv-=5;
aboutplayer.settings.volume=volv;
time.innerText=volv;}
else{time.innerText='最小';}
}
</script>

    一个扩展型网页播放器的雏形基本上就出来了。

    是不是摸到一点门道了?有问题请到谱乐论坛发表或随时随地在线咨询谱乐


[发送给好友]  [打印本页]  [关闭窗口]  [返回顶部]   转载请注明来源:http://edu.chinaz.com   
特别声明: 本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载,但请务必注明出处和原始作者。文章版权归文章原始作者所有。对于被本站转载文章的个人和网站,我们表示深深的谢意。如果本站转载的文章有版权问题请联系编辑人员,我们尽快予以更正。
栏目编辑: 设计风 责任编辑: 设计风
原始作者: aboutplayer 录入时间: 2005-5-28 20:18:11
信息来源: 中国站长学院 投稿信箱: Edu#chinaz.com
设为首页 - 加入收藏 - 关于我们 - 广告服务 - 版权申明 - 友情链接 - 联系方式 - 总编信箱 - 会员投稿