介绍三种网页播放器好代码——三种风格,三种功能,三种结果,三种不同的体验,不错。
第一种
<table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td> <b>在线音乐点播</b></td> </tr> </table> <br> <table align=center style="font:9pt"> <tr> <td> <object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95" id="MediaPlayer1" width="286" height="225"> <param name="AudioStream" value="-1"> <param name="AutoSize" value="-1"> <!--是否自动调整播放大小--> <param name="AutoStart" value="-1"> <!--是否自动播放--> <param name="AnimationAtStart" value="-1"> <param name="AllowScan" value="-1"> <param name="AllowChangeDisplaySize" value="-1"> <param name="AutoRewind" value="0"> <param name="Balance" value="0"> <!--左右声道平衡,最左-9640,最右9640--> <param name="BaseURL" value> <param name="BufferingTime" value="15"> <!--缓冲时间--> <param name="CaptioningID" value> <param name="ClickToPlay" value="-1"> <param name="CursorType" value="0"> <param name="CurrentPosition" value="0"> <!--当前播放进度 -1 表示不变,0表示开头 单位是秒,比如10表示从第10秒处开始播放,值必须是-1.0或大于等于0--> <param name="CurrentMarker" value="0"> <param name="DefaultFrame" value> <param name="DisplayBackColor" value="0"> <param name="DisplayForeColor" value="16777215"> <param name="DisplayMode" value="0"> <param name="DisplaySize" value="0"> <!--视频1-50%, 0-100%, 2-200%,3-全屏 其它的值作0处理,小数则采用四舍五入然后按前的处理--> <param name="Enabled" value="-1"> <param name="EnableContextMenu" value="-1"> <!-是否用右键弹出菜单控制--> <param name="EnablePositionControls" value="-1"> <param name="EnableFullScreenControls" value="-1"> <param name="EnableTracker" value="-1"> <!--是否允许拉动播放进度条到任意地方播放--> <param name="Filename" value="Music/sayoldtime.mp3" valuetype="ref"> <param name="InvokeURLs" value="-1"> <param name="Language" value="-1"> <param name="Mute" value="0"> <!--是否静音--> <param name="PlayCount" value="10"> <!--重复播放次数,0为始终重复--> <param name="PreviewMode" value="-1"> <param name="Rate" value="1"> <!--播放速度1.0-2.0倍的速度播放--> <param name="SAMILang" value> <param name="SAMIStyle" value> <param name="SAMIFileName" value> <!--选择同时播放(伴音)的歌曲--> <param name="SelectionStart" value="-1"> <param name="SelectionEnd" value="-1"> <param name="SendOpenStateChangeEvents" value="-1"> <param name="SendWarningEvents" value="-1"> <param name="SendErrorEvents" value="-1"> <param name="SendKeyboardEvents" value="0"> <param name="SendMouseClickEvents" value="0"> <param name="SendMouseMoveEvents" value="0"> <param name="SendPlayStateChangeEvents" value="-1"> <param name="ShowCaptioning" value="0"> <!--是否显示字幕,为一块黑色,下面会有一大块黑色,一般不显示--> <param name="ShowControls" value="-1"> <!--是否显示控制,比如播放,停止,暂停--> <param name="ShowAudioControls" value="-1"> <!--是否显示音量控制--> <param name="ShowDisplay" value="0"> <!--显示节目信息,比如版权等--> <param name="ShowGotoBar" value="0"> <!--一条框,在下面,有往下箭头--> <param name="ShowPositionControls" value="-1"> <!--是否显示往前往后及列表,如果显示一般也都是灰色不可控制--> <param name="ShowStatusBar" value="-1"> <!--当前播放信息,显示是否正在播放,及总播放时间和当前播放到的时间--> <param name="ShowTracker" value="-1"> <!--是否显示当前播放跟踪条,即当前的播放进度条--> <param name="TransparentAtStart" value="-1"> <param name="VideoBorderWidth" value="0"> <!--显示部的宽部,如果小于视频宽,则最小为视频宽,或者加大到指定值,并自动加大高度.此改变只改变四周的黑框大小,不改变视频大小--> <param name="VideoBorderColor" value="0"> <!--显示黑色框的颜色, 为RGB值,比如ffff00为黄色--> <param name="VideoBorder3D" value="0"> <param name="Volume" value="0"> <!--音量大小,负值表示是当前音量的减值,值自动会取绝对值,最大为0,最小为-9640,最大0--> <param name="WindowlessVideo" value="0"> <!--如果是0可以允许全屏,否则只能在窗口中查看--> </object> <br> <span style="cursor:hand" onClick="alert(document.MediaPlayer1.filename);">查看当前任务</span><br> <b>MP3点播</b> <br><span style="cursor:hand" onClick="document.MediaPlayer1.filename='http://xxzx.wems.net/jxggtd/wems-kj/kjk/yw3/1.MP3';">轩辕剑参外传-天之痕</span> <span style="cursor:hand" onClick="document.MediaPlayer1.filename='http://202.107.236.189/mal/zz/张真-红红好姑娘.mp3';">张真(红红好姑娘)</span> <br> <b>播放速度调整</b> <script> var mediaRate=document.MediaPlayer1.Rate; var mediaVolume=document.MediaPlayer1.Volume; var mediaCurrentPosition=document.MediaPlayer1.CurrentPosition; function setRate(num) { mediaRate=num; document.MediaPlayer1.Rate=num; } function addCurrentPosition(num) { mediaCurrentPosition=document.MediaPlayer1.CurrentPosition; mediaCurrentPosition+=num; if(mediaCurrentPosition<0)mediaCurrentPosition=0; document.MediaPlayer1.CurrentPosition=mediaCurrentPosition; } function addVolume(num) { mediaVolume=document.MediaPlayer1.Volume; if(num>0 && mediaVolume<-1) { mediaVolume+=num; if(mediaVolume>-1)mediaVolume=-1; document.MediaPlayer1.Volume=mediaVolume; } else { if(num<0 && mediaVolume>-9999) { mediaVolume +=num; if(mediaVolume <-9999)mediaVolume=-9999; document.MediaPlayer1.Volume=mediaVolume; } } } function addRate(num) { mediaRate=document.MediaPlayer1.Rate; if(num>0 && mediaRate<12.0) { mediaRate+=num; //if(mediaRate >2.0)mediaRate=2.0; document.MediaPlayer1.Rate=mediaRate; } else { if(num<0 && mediaRate>0.1) { mediaRate +=num; if(mediaRate <0.1)mediaRate=0.1; document.MediaPlayer1.Rate=mediaRate; } } } function exchangeValue(obj) { if(obj=="0") { obj="-1"; } else { obj="0"; } return obj; } </script> <!--速度正常1.0 速度慢0.0<value<1.0 速度快1.0<value<2.0 --> <span style="cursor:hand" onClick="setRate(1.2);">较快</span> <span style="cursor:hand" onClick="addRate(0.1);">加速</span> <span style="cursor:hand" onClick="addRate(-0.1);">减速</span> <span style="cursor:hand" onClick="setRate(0.8);">较慢</span> <span style="cursor:hand" onClick="setRate(1);">正常</span> <span style="cursor:hand" onClick="alert(mediaRate);">查看速度</span> <br> <b>播放声音调整</b> <span style="cursor:hand" onClick="document.MediaPlayer1.Mute=exchangeValue(document.MediaPlayer1.Mute);">静音/取消</span> <span style="cursor:hand" onClick="alert(document.MediaPlayer1.Mute);">查看</span> <br> <span style="cursor:hand" onClick="document.MediaPlayer1.Volume=-1">最大</span> <span style="cursor:hand" onClick="document.MediaPlayer1.Volume=-9999">最小</span> <span style="cursor:hand" onClick="document.MediaPlayer1.Volume=-180">默认</span> <span style="cursor:hand" onClick="document.MediaPlayer1.Volume=-259">中大</span> <span style="cursor:hand" onClick="document.MediaPlayer1.Volume=-399">中等</span> <span style="cursor:hand" onClick="document.MediaPlayer1.Volume=-999">中小</span> <span style="cursor:hand" onClick="document.MediaPlayer1.Volume=-1599">小</span> <span style="cursor:hand" onClick="addVolume(100);">加大音量</span> <span style="cursor:hand" onClick="addVolume(-100);">减少音量</span> <span style="cursor:hand" onClick="alert(document.MediaPlayer1.Volume);">查看</span> <br> <b>播放界面控制</b><br> <span style="cursor:hand" onClick="document.MediaPlayer1.ShowCaptioning=exchangeValue(document.MediaPlayer1.ShowCaptioning);">显示/隐藏字幕</span> <span style="cursor:hand" onClick="alert(document.MediaPlayer1.ShowCaptioning);">查看</span> <br> <span style="cursor:hand" onClick="document.MediaPlayer1.ShowControls=exchangeValue(document.MediaPlayer1.ShowControls);">显示/隐藏播放控制</span> <span style="cursor:hand" onClick="alert(document.MediaPlayer1.ShowControls);">查看</span> <br> <span style="cursor:hand" onClick="document.MediaPlayer1.ShowAudioControls=exchangeValue(document.MediaPlayer1.ShowAudioControls);">显示/隐藏音量控制</span> <span style="cursor:hand" onClick="alert(document.MediaPlayer1.ShowAudioControls);">查看</span> <br> <span style="cursor:hand" onClick="document.MediaPlayer1.ShowDisplay=exchangeValue(document.MediaPlayer1.ShowDisplay);">显示/隐藏节日信息</span> <span style="cursor:hand" onClick="alert(document.MediaPlayer1.ShowDisplay);">查看</span> <br> <span style="cursor:hand" onClick="document.MediaPlayer1.ShowGotoBar=exchangeValue(document.MediaPlayer1.ShowGotoBar);">显示/隐藏GOTOBAR</span> <span style="cursor:hand" onClick="alert(document.MediaPlayer1.ShowGotoBar);">查看</span> <br> <span style="cursor:hand" onClick="document.MediaPlayer1.ShowPositionControls=exchangeValue(document.MediaPlayer1.ShowPositionControls);">显示/隐藏位置控制</span> <span style="cursor:hand" onClick="alert(document.MediaPlayer1.ShowPositionControls);">查看</span> <br> <span style="cursor:hand" onClick="document.MediaPlayer1.ShowStatusBar=exchangeValue(document.MediaPlayer1.ShowStatusBar);">显示/隐藏播放信息</span> <span style="cursor:hand" onClick="alert(document.MediaPlayer1.ShowStatusBar);">查看</span> <br> <span style="cursor:hand" onClick="document.MediaPlayer1.ShowTracker=exchangeValue(document.MediaPlayer1.ShowTracker);">显示/隐藏播放跟踪条</span> <span style="cursor:hand" onClick="alert(document.MediaPlayer1.ShowTracker);">查看</span> <br> <b>声道切换</b> <span style="cursor:hand" onClick="document.MediaPlayer1.Balance=-9640;">左声道</span> <span style="cursor:hand" onClick="document.MediaPlayer1.Balance=9640;">右声道</span> <span style="cursor:hand" onClick="document.MediaPlayer1.Balance=0;">左右平衡</span> <span style="cursor:hand" onClick="alert(document.MediaPlayer1.Balance);">查看</span> <br> <b>视频窗口大小</b> <span style="cursor:hand" onClick="document.MediaPlayer1.DisplaySize=1;">50%</span> <span style="cursor:hand" onClick="document.MediaPlayer1.DisplaySize=0;">100%</span> <span style="cursor:hand" onClick="document.MediaPlayer1.DisplaySize=2;">200%</span> <span style="cursor:hand" onClick="document.MediaPlayer1.DisplaySize=3;">全屏</span> <span style="cursor:hand" onClick="alert(document.MediaPlayer1.DisplaySize);">查看</span> <br> <b>播放进度控制</b> <span style="cursor:hand" onClick="document.MediaPlayer1.CurrentPosition=0;">回到开始</span> <span style="cursor:hand" onClick="addCurrentPosition(60);">前进一分钟</span> <span style="cursor:hand" onClick="addCurrentPosition(-60);">后退一分钟</span> <span style="cursor:hand" onClick="document.MediaPlayer1.CurrentPosition=99999;">到最后</span> <span style="cursor:hand" onClick="alert(document.MediaPlayer1.CurrentPosition);">查看</span> <br> <b>选择伴音</b> <span style="cursor:hand" onClick="document.MediaPlayer1.SAMIFileName='http://xxzx.wems.net/jxggtd/wems-kj/kjk/yw3/1.MP3';">天之痕</span> <span style="cursor:hand" onClick="document.MediaPlayer1.SAMIFileName='';">无</span> <span style="cursor:hand" onClick="alert(document.MediaPlayer1.SAMIFileName);">查看</span> (注意不能马上生效,点击后需要再重新播放歌曲) <span style="cursor:hand" onClick="alert(document.MediaPlayer1.maxlength);">查看</span> <script language=vbscript> for each obj in document.MediaPlayer1.all messagebox(obj) next </script> </td></tr></table>
第二种
<html> <head> <title>aboutplayer</title> <style> body { overflow:auto; font-size:12px; cursor:default; background-color: #977E4A; } #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:23px; left: -1px; } #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; } .style1 { color: #006699; font-weight: bold; } .style2 {font-size: 12px} a:link { text-decoration: none; } a:visited { text-decoration: none; } a:hover { text-decoration: none; } a:active { text-decoration: none; } .style4 {font-size: 12px; color: #FFFF33; } .style7 {font-family: "Times New Roman", Times, serif} </style> <script> 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<playList.options.length-1){ playList.options[playList.options.selectedIndex+1].selected=true; }else{ playList.options[0].selected=true; } MediaPlayer1.fileName=playList.value; MediaPlayer1.play(); setTimeout('MediaPlayer1.play();MediaPlayer1.attachEvent("PlayStateChange",checkPlayStatus);',1000); } }catch(e){} } </script> <script> function doFull() { var objId = "MediaPlayer1"; var funcStr = objId + ".displaySize = 3"; eval(funcStr); } </script> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"><body onload="init();"> <table id=table01> <tr> <td> <object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95" id="MediaPlayer1" width="286" height="225" STANDBY="Loading Windows Media Player components..." TYPE="application/x-oleobject"> <param name="AudioStream" value="-1"> <param name="AutoSize" value="-1"> <!--是否自动调整播放大小--> <param name="AutoStart" value="0"> <!--是否自动播放--> <param name="AnimationAtStart" value="-1"> <param name="AllowScan" value="-1"> <param name="AllowChangeDisplaySize" value="-1"> <param name="AutoRewind" value="0"> <param name="Balance" value="0"> <!--左右声道平衡,最左-9640,最右9640--> <param name="BaseURL" value> <param name="BufferingTime" value="15"> <!--缓冲时间--> <param name="CaptioningID" value> <param name="ClickToPlay" value="-1"> <param name="CursorType" value="0"> <param name="CurrentPosition" value="0"> <!--当前播放进度 -1 表示不变,0表示开头 单位是秒,比如10表示从第10秒处开始播放,值必须是-1.0或大于等于0--> <param name="CurrentMarker" value="0"> <param name="DefaultFrame" value> <param name="DisplayBackColor" value="0"> <param name="DisplayForeColor" value="16777215"> <param name="DisplayMode" value="0"> <param name="DisplaySize" value="0"> <!--视频1-50%, 0-100%, 2-200%,3-全屏 其它的值作0处理,小数则采用四舍五入然后按前的处理--> <param name="Enabled" value="-1"> <param name="EnableContextMenu" value="1"> <!-是否用右键弹出菜单控制--> <param name="EnablePositionControls" value="-1"> <param name="EnableFullScreenControls" value="-1"> <param name="EnableTracker" value="-1"> <!--是否允许拉动播放进度条到任意地方播放--> <param name="Filename" value="" valuetype="ref"> <param name="InvokeURLs" value="-1"> <param name="Language" value="-1"> <param name="Mute" value="0"> <!--是否静音--> <param name="PlayCount" value="10"> <!--重复播放次数,0为始终重复--> <param name="PreviewMode" value="-1"> <param name="Rate" value="1"> <!--播放速度1.0-2.0倍的速度播放--> <param name="SAMILang" value> <param name="SAMIStyle" value> <param name="SAMIFileName" value> <!--选择同时播放(伴音)的歌曲--> <param name="SelectionStart" value="-1"> <param name="SelectionEnd" value="-1"> <param name="SendOpenStateChangeEvents" value="-1"> <param name="SendWarningEvents" value="-1"> <param name="SendErrorEvents" value="-1"> <param name="SendKeyboardEvents" value="0"> <param name="SendMouseClickEvents" value="0"> <param name="SendMouseMoveEvents" value="0"> <param name="SendPlayStateChangeEvents" value="-1"> <param name="ShowCaptioning" value="0"> <!--是否显示字幕,为一块黑色,下面会有一大块黑色,一般不显示--> <param name="ShowControls" value="-1"> <!--是否显示控制,比如播放,停止,暂停--> <param name="ShowAudioControls" value="-1"> <!--是否显示音量控制--> <param name="ShowDisplay" value="0"> <!--显示节目信息,比如版权等--> <param name="ShowGotoBar" value="0"> <!--一条框,在下面,有往下箭头--> <param name="ShowPositionControls" value="-1"> <!--是否显示往前往后及列表,如果显示一般也都是灰色不可控制--> <param name="ShowStatusBar" value="-1"> <!--当前播放信息,显示是否正在播放,及总播放时间和当前播放到的时间--> <param name="ShowTracker" value="-1"> <!--是否显示当前播放跟踪条,即当前的播放进度条--> <param name="TransparentAtStart" value="-1"> <param name="VideoBorderWidth" value="0"> <!--显示部的宽部,如果小于视频宽,则最小为视频宽,或者加大到指定值,并自动加大高度.此改变只改变四周的黑框大小,不改变视频大小--> <param name="VideoBorderColor" value="0"> <!--显示黑色框的颜色, 为RGB值,比如ffff00为黄色--> <param name="VideoBorder3D" value="0"> <param name="Volume" value="0"> <!--音量大小,负值表示是当前音量的减值,值自动会取绝对值,最大为0,最小为-9640,最大0--> <param name="WindowlessVideo" value="0"> <embed src="-1" width="286" height="225" autostart="0" audiostream="-1" autosize="-1" animationatstart="-1" allowscan="-1" allowchangedisplaysize="-1" autorewind="0" balance="0" baseurl="value" bufferingtime="15" captioningid="value" clicktoplay="-1" cursortype="0" currentposition="0" currentmarker="0" defaultframe="value" displaybackcolor="0" displayforecolor="16777215" displaymode="0" displaysize="0" enabled="-1" enablecontextmenu="-1" enablepositioncontrols="-1" enablefullscreencontrols="-1" enabletracker="-1" filename="" invokeurls="-1" language="-1" mute="0" playcount="10" previewmode="-1" rate="1" samilang="value" samistyle="value" samifilename="value" selectionstart="-1" selectionend="-1" sendopenstatechangeevents="-1" sendwarningevents="-1" senderrorevents="-1" sendkeyboardevents="0" sendmouseclickevents="0" sendmousemoveevents="0" sendplaystatechangeevents="-1" showcaptioning="0" showcontrols="-1" showaudiocontrols="-1" showdisplay="0" showgotobar="0" showpositioncontrols="-1" showstatusbar="-1" showtracker="-1" transparentatstart="-1" videoborderwidth="0" videobordercolor="0" videoborder3d="0" volume="0" windowlessvideo="0"></embed> <!--如果是0可以允许全屏,否则只能在窗口中查看--> </object> </td> <td> <div id=playListTitle>Play List:</div> <select id=playList size=2 ondragover="playList_dragOver();" ondragenter="playList_dragEnter();" ondrop="playList_drop();" onkeydown="playList_keyDown();" ondblclick="playList_dblClick();"> </select> </td> </tr> </table> <script language="JavaScript1.2"> var dragswitch=0 var nsx var nsy var nstemp function drag_dropns(name){ temp=eval(name) temp.captureEvents(Event.MOUSEDOWN | Event.MOUSEUP) temp.onmousedown=gons temp.onmousemove=dragns temp.onmouseup=stopns } function gons(e){ temp.captureEvents(Event.MOUSEMOVE) nsx=e.x nsy=e.y } function dragns(e){ if (dragswitch==1){ temp.moveBy(e.x-nsx,e.y-nsy) return false } } function stopns(){ temp.releaseEvents(Event.MOUSEMOVE) } //drag drop function for IE 4+//// ///////////////////////////////// var dragapproved=false function drag_dropie(){ if (dragapproved==true){ document.all.showimage.style.pixelLeft=tempx+event.clientX-iex document.all.showimage.style.pixelTop=tempy+event.clientY-iey return false } } function initializedragie(){ iex=event.clientX iey=event.clientY tempx=showimage.style.pixelLeft tempy=showimage.style.pixelTop dragapproved=true document.onmousemove=drag_dropie } if (document.all){ document.onmouseup=new Function("dragapproved=false") } ////drag drop functions end here////// function hidebox(){ if (document.all) showimage.style.visibility="hidden" else if (document.layers) document.showimage.visibility="hide" } </script> <div id="showimage" style="position:absolute; width:500px; left:465px; top:18px; height: 0px;"> <table border="0" width="199" cellspacing="0" cellpadding="0"> <tr> <td width="100%"><table border="0" width="100%" cellspacing="0" cellpadding="0" height="36"> <tr> <td width="100%" bgcolor="#C6FFC6" style="padding:4px" onMousedown="initializedragie()"><ilayer width="100%" onSelectStart="return false"><layer width="100%" onMouseover="dragswitch=1;drag_dropns(showimage)" onMouseout="dragswitch=0" class="style1"> <div align="left" class="style2"> <div align="center">用鼠标按着我拖拖看<span class="style7">^o^</span></div> </div> </layer> </ilayer></td> <td bgcolor="#00CCFF" style="cursor:hand"><strong><a href="#" onClick="hidebox();return false">×</a></strong></td> </tr> <tr> <td width="100%" style="padding:4px" colspan="2"><p> </p> <div id=musicList ondragstart="musicList_dragStart();"> <div class="style2" id=musicListTitle>All Music</div> <span class="style2"><a href="http://www.gyvnet.com/music_new/web/user/usermusic/2947/2005030813201579754.mp3" onclick="addMusic();">麻吉弟弟 甜蜜蜜</a><br> <a href="http://www.gyvnet.com/music_new/web/user/usermusic/2308/2005063004283371564.mp3" onclick="addMusic();">第一滴泪 - 动力火车</a><br> <a href="http://211.90.238.134/blog/upload/music/half.sugar.wma" onclick="addMusic();">半糖主义 - SHE</a><br> <a href="http://web.163.sh.cn/~kkyhm/music/3.wma" onclick="addMusic();">发如雪 - 周杰伦</a></span><br> <hr> <span class="style4">Tips: 把歌曲拖入播放列表<br> </span> <input type="button" class="style2" onclick="doFull();" value="全屏/ESC返回"> </div> </td> </tr> </table> </td> </tr> </table> </div> <div id=info></div> <body> </html>
第三种
<HTML xmlns:v> <style> v\:*{behavior:url(#default#VML)} v\:textpath{font-family:楷体_gb2312;font-size:26px;v-text-align:left} </style> <body> <xmp id=xLyric style=display:none> [ti:请跟我来] [ar:苏芮&虞戡平] [al:] [00:00.00]曲 : 梁弘志 [00:06.34]词 : 梁弘志 [00:16.00]<1-3:3;6:2;7:3>我踩着不变的步伐 [00:22.19]<3:2;6:2;9:2>是为了配合你的到来 [00:28.54]在慌张迟疑的时候 [00:35.25]请跟我来 [00:41.61]我带着梦幻的期待 [00:47.96]是无法按捺的情怀 [00:53.99]在你不注意的时候 [01:00.75]请跟我来 [02:19.49][01:10.00]别说什么 [02:26.39][01:16.28]那是你无法预知的世界 [02:33.94][01:23.51]别说 你不用说 [02:39.72][01:29.32]你的眼睛已经告诉了我 [02:52.22][01:42.46]当春雨飘呀飘的飘在 [02:58.54][01:48.41]你滴也滴不完的发梢 [03:04.62][01:54.53]戴着你的水晶珠链 [03:11.60][02:01.36]请跟我来 [03:19.24][02:07.02]www.aboutplayer.com </xmp> </body> </html> <script> window.onerror=function(){return false} start() function start(){ browser_ini() timer_ini() emv_ini() lrc.setData(oo("xLyric").innerHTML) lrc.write("歌曲载入中,请耐心等待...","l") emv.play("mms://218.66.102.192/mp3/2005-01-06/fea30a20-e49f-4ebc-8f25-44cfe4830ca7.wma") } function emv_ini(){ var l window.emv={} lrc_ini() l="<div id=bxEmv style=position:absolute;left:180;top:50;width:600;height:460>" l+="<div style=position:absolute;left:0;top:0;width:600;height:460;></div>" l+="<div id=bxEmvScreen style=position:absolute;overflow:hidden;left:19;top:26;width:560;height:360;>" l+="</div>" l+="</div>" l+="<object classid=clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95 id=mplayer width=250 height=200 style=display:none></object>" insHtm(document.body,l) emv.play=function(url){oo("mplayer").FileName=url;oo("mplayer").Play()} emv.time=function(){ var mPos=mplayer.CurrentPosition,n=lrc.i var n1,o,len,w,per,n0,n1 n1=n<lrc.arr.length-1?lrc.arr[n+1].slice(0,"|")*1:9999 if(n1<mPos){ lrc.i++ n++ if(n==0) lrc.write(lrc.arr[n].slice("|"),"l") if(n<lrc.arr.length-1) lrc.write(lrc.arr[n+1].slice("|"),n%2==1?"l":"r") } if(n>=0){ n0=lrc.arr[n].slice(0,"|") n1=lrc.arr.length>n+1?lrc.arr[n+1].slice(0,"|"):4 o=oo("bxCaption_"+(n%2==0?"l":"r")+"_cover") len=o.time!=""?o.time*1:n1-n0 per=(mPos-n0)/len for(i=0.001;i<1;i+=0.001){ per1=lrc.getRealPos(o,i) if(per1>=per) break } o.style.width=o.width*i } } timer.add("emv.time()") } function lrc_ini(){ window.lrc={} lrc.wordPer=function(str,pos){ return str.slice(0,pos).replace(/[^\x00-\xff]/g," ").length/str.replace(/[^\x00-\xff]/g," ").length } lrc.setData=function(str){ var l,a,i,ad,n,j str=str.replace(/\|/g,"").replace(/\r\n/g,"\n") str=str.replace(/\[(\d\d)\:(\d\d)\.(\d\d)\]/g,function($0,$1,$2,$3){return ($1*60+$2*1+$3/100)+"|"}) a=str.split("\n") lrc.arr=new Array() for(i=0;i<a.length;i++){ ad=a[i].split("|") for(j=1;j<ad.length;j++){ lrc.arr.add(ad[j-1]+"|"+ad[ad.length-1]) } } lrc.i=-1 sortIndex=0 sortDir=1 lrc.arr.sort(sortFoo) } lrc.getRealPos=function(obj,pos){ var a=obj.path,zoom=obj.zoom,pos1=pos*zoom var a,i,ad for(i=0;i<a.length;i++){ ad=a[i] if(pos<=ad[0]) continue if(pos>ad[0]&&pos<=ad[1]) pos1+=(zoom*ad[2]-zoom)*(pos-ad[0]) else{ pos1+=(zoom*ad[2]-zoom)*(ad[1]-ad[0]) } } return pos1 } lrc.write=function(str,pos){ var word=str,style="" var x,y,l,w,w1,o,a,i,ad if(/^\<.+\>/.test(str)){ word=str.slice(">") style=str.slice(1).slice(0,">") } w=word.replace(/[^\x00-\xff]/g," ").length*13+2 if(pos=="l"){ x=40 y=285 } else{ x=520-w y=315 } l="<div id=bxCaption_"+pos+" style='position:absolute;left:"+x+";top:"+y+";width:"+w+";height:32;overflow:hidden'>" l+="<v:curve to=800,1 strokecolor=black strokeweight=3 style=position:absolute;top:14>" l+="<v:path textpathok=t /><v:textpath on=t string='"+word+"' /></v:curve>" l+="<v:curve to=800,1 strokecolor=white fillcolor=white strokeweight=1 style=position:absolute;top:14>" l+="<v:path textpathok=t /><v:textpath on=t string='"+word+"' /></v:curve>" l+="</div>" l+="<div id=bxCaption_"+pos+"_cover width="+w+" style=position:absolute;left:"+x+";top:"+y+";width:0;height:32;overflow:hidden>" l+="<v:curve to=800,1 strokecolor=white strokeweight=3 style=position:absolute;top:14>" l+="<v:path textpathok=t /><v:textpath on=t string='"+word+"' /></v:curve>" l+="<v:curve to=800,1 strokecolor=blue fillcolor=blue strokeweight=1 style=position:absolute;top:14>" l+="<v:path textpathok=t /><v:textpath on=t string='"+word+"' /></v:curve>" l+="</div>" odel("bxCaption_"+pos) odel("bxCaption_"+pos+"_cover") insHtm("bxEmvScreen",l) o=oo("bxCaption_"+pos+"_cover") o.time=style.get("time") o.path=new Array() len1=1 a=style.split(";") for(i=0;i<a.length;i++){ if(!/(\d+):(\d+)/.test(a[i])) continue if(/(\d+)-(\d+):(\d+)/.test(a[i])){ ad=/(\d+)-(\d+):(\d+)/.exec(a[i]) ad[0]=lrc.wordPer(word,ad[1]-1) ad[1]=lrc.wordPer(word,ad[2]*1) ad[2]=ad[3] } else{ ad=/(\d+):(.+)/.exec(a[i]) ad[0]=lrc.wordPer(word,ad[1]-1) ad[1]=lrc.wordPer(word,ad[1]*1) } len1+=(ad[1]-ad[0])*(ad[2]-1) o.path.add(ad) } o.zoom=1/len1 } } function browser_ini(){ window.isIE=navigator.userAgent.indexOf("IE")>0 window.isIE5=navigator.userAgent.indexOf("IE 5.0")>0 String.prototype.trim=function(){return this.replace(/(^[\s]*)|([\s]*$)/g,"")} String.prototype.inc=function(s1,s2){if(s2==null){s2=","};return (s2+this+s2).indexOf(s2+s1+s2)>-1?true:false} String.prototype._slice="".slice String.prototype.slice=function(n1,n2){var v,b1=typeof(n1)=="number",b2=typeof(n2)=="number";if(!b1||typeof(n2)=="string"){v=eval("this._slice("+(b1?n1:this.indexOf(n1)+(n2==null?1:0)+(this.indexOf(n1)==-1?this.length:0))+(n2==null?"":(b2?n2:(this.indexOf(n2)==-1?"":","+this.indexOf(n2))))+")")}else{v=isIE5&&n1<0&&n2==null?this._slice(this.length-1):eval("this._slice(n1"+(n2==null?"":","+n2)+")")}return v} String.prototype.get=function(str,def){if(this.inc(str,";"))return 1;var a=this.match(new RegExp("(^|;)"+str+":[^;]*"));return a==null||str==""?(def==null?"":def):a[0].replace(";","").slice(str.length+1)} Array.prototype.add=function(key){this[this.length]=key} window.oo=function(obj){return typeof(obj)=="string"?document.getElementById(obj):obj} window.insHtm=function(op,html,inEnd){op=oo(op);if(isIE){op.insertAdjacentHTML(inEnd==null?"beforeend":"afterbegin",html)}else{var r=op.ownerDocument.createRange();r.setStartBefore(op);eval("op."+(inEnd==null?"appendChild":"insertBefore")+"(r.createContextualFragment(html),op.firstChild)");}} window.odel=function(obj){if(oo(obj)!=null){oo(obj).parentNode.removeChild(oo(obj))}} if(!isIE){ HTMLElement.prototype.contains=function(node){if(!node)return false;do if(node==this){return true}while(node=node.parentNode){return false}} Event.prototype.__defineGetter__("srcElement",function(){var node=this.target;while(node.nodeType!=1){node=node.parentNode}return node}) Event.prototype.__defineGetter__("toElement",function(){return this.relatedTarget}) } } function timer_ini(){ window.timer={} timer.handle=null timer.queue="" timer.i=0 timer.add=function(key){if(!timer.queue.inc(key,";")){timer.queue+=key+";"}} timer.del=function(key){timer.queue=move.queue.replace(key+";","")} timer.inv=function(){ window.clearTimeout(timer.handle) eval(timer.queue) timer.i++ timer.handle=window.setTimeout("timer.inv()",10) } timer.inv() } function sortFoo(v1,v2){ var s1=v1.split("|")[sortIndex],s2=v2.split("|")[sortIndex] if(!isNaN(s1)&&!isNaN(s2)){ s1*=1 s2*=1 } return (s1==s2?0:(s1>s2?1:-1))*sortDir } </script>