Window Media Player 播放器

比较吃力的地方是drop到播放列表,查MSDN查了n久,还有Window Media Player 6.x插件的play有些奇怪,所以我的代码也有些奇怪........

拜托各位多测测,有Bug您说话,看我做的也挺不容易的,觉得好的您也多捧捧场。

My HTML Player

body {
overflow:auto;
font-size:12px;
cursor:default;
}

#table01 {
font-size:12px;
background-Color:black;
color:white;
text-align:center;
}

#playListTitle {
background-Color:#001122;
color:white;
font-size:12px;
font-weight:bold;
width:100%;
height:16px;
padding:2px;
}

#playList {
width:150px;
height:225px;
margin:0px;
font-size:12px;
background-Color:black;
color:white;
}

#musicList {
width:200px;
border:buttonface 4px groove;
height:80px;
position:absolute;
right:5px;
top:5px;
}

#musicListTitle {
font-size:13px;
width:100%;
height:20px;
background-Color:#C5FFC5;
padding:3px;
font-weight:bold;
}

#musicList a {
text-decoration:none;
width:100%;
height:20px;
line-height:20px;
font-szie:20px;
line-height:20px;
padding-top:5px;
padding-left:10px;
}

#musicList a:hover {
background-Color:#E5FFE5;
}

function playList_dragOver(){
event.returnValue=false;
}

function playList_dragEnter(){
event.returnValue=false;
event.dataTransfer.dropEffect='link';
}

function addMusic(){
if(event.srcElement.tagName=='A'){
strTxt=event.srcElement.innerText;
strURL=event.srcElement.href;
playList.innerHTML="";
playList.options[0]=new Option(strTxt,strURL);
playList.options[0].selected=true;
}
event.returnValue=false;

playList_dblClick();
return(false);
}

function playList_drop(){
strTxt=unescape(event.dataTransfer.getData('Text').split(":")[0]);
strURL=unescape(event.dataTransfer.getData('Text').split(":")[1]);
playList.options[playList.options.length]=new Option(strTxt,strURL);
}

function playList_keyDown(){
if(event.keyCode==46){
try{
playList.options[playList.options.selectedIndex].outerHTML="";
}catch(e){}
return(false);
}
if(event.keyCode==13){
playList_dblClick();
return(false);
}
}

function playList_dblClick(){
MediaPlayer1.detachEvent("PlayStateChange",checkPlayStatus);
MediaPlayer1.fileName=playList.value;
MediaPlayer1.play();
setTimeout('MediaPlayer1.play();MediaPlayer1.attachEvent("PlayStateChange",checkPlayStatus);',1000);
}

function musicList_dragStart(){
if(event.srcElement.tagName=='A'){
event.dataTransfer.setData('Text',escape(event.srcElement.innerText)+":"+escape(event.srcElement.href));
}else{
return(false);
}
}

function init(){
MediaPlayer1.AutoRewind=false;
MediaPlayer1.AutoStart=true;
MediaPlayer1.SendPlayStateChangeEvents=true;
MediaPlayer1.attachEvent("PlayStateChange",checkPlayStatus);
}

function checkPlayStatus(oldState,newState){
try{
if(MediaPlayer1.PlayState==0){
MediaPlayer1.detachEvent("PlayStateChange",checkPlayStatus);
MediaPlayer1.stop();
if(playList.options.selectedIndex


Play List:

All Music

夜曲 - 周杰伦

笔记 - 周笔畅

不得不爱 - 潘玮柏

发如雪 - 周杰伦


Tips: 把歌曲拖入播放列表

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

(0)

相关推荐

  • 基于jQuery的网页影音播放器jPlayer的基本使用教程

    jPlayer简介: 想在网页上播放背景音乐,不想用html标签的方式,因为那样只有音乐全部下载完以后才能播放,还容易出现跨浏览器兼容性的问题,于是选了一款基于jQuery的播放器jPlayer来做. 设置jPlayer的尺寸大小 使用构造函数配置jPlayer({size:Object})设置jPlayer的高宽. 使用构造函数配置jPlayer({sizeFull:Object})设置全屏尺寸. 注意可通过构造函数配置jPlayer({backgroundColor:"#RRGGBB&quo

  • layer弹出层中H5播放器全屏出错的解决方法

    1. 在layer弹窗组件中 如果使用了flash播放器,全屏是正常的 但若使用了HTML5的播放器,全屏失效 举个栗子 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js

  • MediaPlayer 在线播放器代码

    <object id="MediaPlayer1" width="220" height="176" align="baseline" border="0" classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95"> <param name="AudioStream" VALUE="-1&qu

  • flvplayer.swf flv视频播放器使用方法

    一.直接在html文件中加载: 复制代码 代码如下: <div id="FlashFile"> <object type="application/x-shockwave-flash" width="470px" height="403px" data="flvplayer.swf?file=movies/company.flv"> <param name="movi

  • 超酷的网页音乐播放器DewPlayer使用方法

    使用方法:把代码添加到模板中,或者像我一样,放到广告代码中进行调用.注意修改swf文件和mp3文件路径.如需自动开始并循环播放,请添加代码 &autostart=1&autoreplay=1 ,如"mp3=http://www.x.com/x.mp3&autostart=1&autoreplay=1". 1.stream[135x50] 复制代码 代码如下: <embed flashvars="mp3=mp3/test1.mp3"

  • 内嵌式RealPlayer播放器的参数含义

    内嵌式RealPlayer播放器的参数含义                 内嵌式RealPlayer播放器的参数含义 参数:autostart 属性:True或是False 作用:指定是否自动播放指定的源文件 参数:backgroundcolor 属性:任何用符号"#"开头的16进制数值或是任何预定义的颜色 作用:指定图像窗口的背景颜色 参数:center 属性:True或是False 作用:指定片断使用初始编码大小播放,并且在图像窗口的中央. 参数:classid 属性:"

  • 基于Flowplayer打造一款免费的WEB视频播放器附源码

    Flowplayer 是一个开源(GPL 3的)WEB视频播放器.您可以将该播放器嵌入您的网页中,如果您是开发人员,您还可以自由定制和配置播放器相关参数以达到您要的播放效果.本文主要介绍Flowplayer的使用. 查看演示   源码下载 Flowplayer支持播放flv.swf等流媒体以及图片文件,能够非常流畅的播放视频文件,支持自定义配置和扩展. 1.加载flowplayer.js 在要播放视频的页面的head之间加入flowplayer.js. <script type="text

  • 网页播放器的参数含义 Windows Media Player 网页播放器 参数含义

    (默认0为否,-1或1为是)<object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95" id="MediaPlayer1" width="286" height="225">   <param name="AudioStream" value="-1">   <param name="A

  • Android MediaPlayer实现音乐播放器实例代码

    Android MediaPlayer实现音乐播放器 1.布局文件 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height=&qu

  • 页面嵌入Windows Media Player播放器代码需要注意的

    这里是WMP的版本ClassID,从WMP7后ID就成了clsid:6BF52A52-394A-11D3-B153-00C04F79FAA6,之前的6.4为clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95,但是之前的版本还是可以用的,只不过新功能用不了罢了. 下面这个是具体的版本号,你可以对比一下你现在的是什么版本. 版本号              Windows Media Player (WMP) 的版本-------------------------

随机推荐