自己動(dòng)手做精美播放器，試試吧！

情愫秋生 2016-03-07

展開(kāi)全文

將下列代碼復(fù)制、粘貼到記事本（開(kāi)始--程序--附件--記事本），然后，單擊記事本左上角的"文件"，單擊--另存為，"文件名"欄目輸入睡蓮.html ,單擊--保存。再在"我的文檔"中找到睡蓮.html 文件，雙擊"e"字圖標(biāo)打開(kāi),看看效果，美吧，一次不成，再打開(kāi)一次，一定成功！

……………………………………………………………………………………………………………

<br><br><br><br><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<P align=center><img title=音畫(huà)代碼編輯：月夜賞星   alt=音畫(huà)代碼編輯：月夜賞星 onload="var image=new Image();image.src=this.src;if(image.width>0 && image.height>0){if(image.width>=400){this.width=400;this.height=image.height*400/image.width;}}" style="BORDER-RIGHT: #987cb9 5px dashed; BORDER-TOP: #987cb9 5px dashed; BORDER-LEFT: #987cb9 5px dashed; BORDER-BOTTOM: #987cb9 5px dashed" src="http://b40.photo.store.qq.com/http_imgload.cgi?/rurl4_b=b68f00f93a9caef1b8227b87f9ab7d537301431aacfbe94a50da5092e5dceb976c865f01ed605b4ab007f1146665f48cb06d5aa21f0ad2f412d372dc580a949f2311da32da1d0738ce8cdac58482fae699605c8a&a=34&b=40" width=400>
    <tr><td><DIV style="MARGIN-TOP: -395px; MARGIN-LEFT: 300px">
<EMBED height=350 type=application!/x- width=400 src= http://images./attachments/day_091019/20091019_52a98d8c5e29d1d937af0fc9mBM8KxkU.swf
WMODE="transparent" ALLOWNETWORKING="internal"></EMBED></div>
<DIV align=center>
<TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
<TBODY>
<TR>
<TD class=Pcontent><span id="ob_logd25151"></span> 
<STYLE type=text/css>
TD {
FONT-SIZE: 9pt; LINE-HEIGHT: 17px
}
BODY { FONT-SIZE: 9pt;
MARGIN: 0px;
LINE-HEIGHT: 17px;
background-color: #ffffff;
}
#lrcollbox TD
{
FONT-SIZE: 20px; LINE-HEIGHT: 25px; FONT-FAMILY: 黑體
}
#lrcollbox FONT {
FONT-SIZE: 20px; LINE-HEIGHT: 25px; FONT-FAMILY: 黑體
}
#lrcoll TD {
CURSOR: default; COLOR: #00c6ff
}
#lrcbox {
COLOR: ##cc9966}
#lrcfilter {
FILTER: alpha(opacity=10)
}
#lrcbc {
COLOR: #ff0000
}
</STYLE><tr><td>

<META content="MSHTML 6.00.2900.5512" name=GENERATOR><SPAN id=lrcdata><!--
[offset:500]
[00:00.09]睡蓮
[00:05.00]演唱：黃鶯鶯
[00:11.00]詞:葽以功曲:李達(dá)濤
[00:17.00]同步歌詞制作：月夜賞星
[02:12.58][00:22.75]你是朵盈潔的睡蓮
[02:23.38][00:33.94]漂浮在青春的水面
[02:34.27][00:45.36]我是如此如此的羞見(jiàn)
[02:44.45][00:56.25]羞見(jiàn)你醉人的笑顏
[01:07.03]你是瓣上露珠點(diǎn)點(diǎn)
[01:18.02]閃爍著愛(ài)情的詩(shī)篇
[01:29.16]我是如此如此的羞見(jiàn)
[01:40.00]羞見(jiàn)你滑落綠波間
[01:50.01]●●●●●
[02:57.45]謝謝欣賞

--></SPAN></td></tr>
<DIV >
<TABLE height=20 cellSpacing=0 cellPadding=0 width=565
background=0 border=0>
<TBODY>
<TR>
    <TD>
<DIV id=Layer2 style="Z-INDEX: 2; POSITION: absolute; TOP: -92px;"><SPAN 說(shuō)明：上行top改變上下；下行height改變顯示歌詞范圍>
<DIV id=lrcollbox style="LEFT: 0px; OVERFLOW: hidden; WIDTH: 500px; HEIGHT: 150px">
<TABLE oncontextmenu="return false;" id=lrcoll style="LEFT: 30px; POSITION: relative; TOP: 0px" cellSpacing=0 cellPadding=0 width="80%" align=center border=0>
<TBODY>
<TR>
<TD id=lrcwt1 noWrap align=middle height=40></TD></TR>
<TR>
<TD id=lrcwt2 noWrap align=middle height=40></TD></TR>
<TR>
<TD noWrap align=middle height=20>
<TABLE cellSpacing=0 cellPadding=0 border=0>
<TBODY>
<TR>
<TD noWrap height=40><SPAN id=lrcwt3 style="HEIGHT: 40px"></SPAN></TD></TR>
<TR style="POSITION: relative; TOP: -40px">
<TD noWrap height=40>
<DIV id=lrcfilter style="OVERFLOW: hidden; WIDTH: 100%; COLOR: #ff0000; HEIGHT: 40px"></DIV></TD></TR></TBODY></TABLE></TD></TR>
<TR style="POSITION: relative; TOP: -40px">
<TD noWrap align=middle height=40>
<TABLE cellSpacing=0 cellPadding=0 border=0>
<TBODY>
<TR>
<TD noWrap height=30><SPAN id=lrcbox style="HEIGHT: 40px"></SPAN></TD></TR>
<TR style="POSITION: relative; TOP: -40px">
<TD noWrap height=40>
<DIV id=lrcbc style="OVERFLOW: hidden; WIDTH: 0px; HEIGHT: 40px"></DIV></TD></TR>
<DIV></DIV></TBODY></TABLE></TD></TR>
<TR style="POSITION: relative; TOP: -90px">
<TD id=lrcwt4 noWrap align=middle height=40></TD></TR></TBODY></TABLE></DIV>
<DIV></DIV></SPAN>
<DIV></DIV></TD></TR></TBODY></TABLE>
<P></P></TD></TR></TBODY></TABLE>

<object style="POSITION: relative; FILTER: Xray" TOP: 600px; left: -0px;" id=aboutplayer height=2 width=2     classid=clsid:6bf52a52-394a-11d3-b153-00c04f79faa6>
        <param name="url" value="http://music./d79/C7/52/m_c7tk787cd0b3_128.mp3">
        <param name="autostart" value="ture">
        <param name="volume" value="100">
        <param name="enablecontextmenu" value="0">
        <param name="enableerrordialogs" value="0">
        <param name="playCount" value="5">
      </object>
<P></P>
<SCRIPT language=JavaScript>
var lrc0;
var lrc1;
var min;
lrcobj = new lrcClass(lrcdata.innerHTML.slice(4,-3));
function lrcClass(tt)
{
this.inr = [];
this.min = [];
this.oTime = 0;
this.dts = -1;
this.dte = -1;
this.dlt = -1;
this.ddh;
this.fjh;
lrcbc.style.width = 0;
if(/\[offset\:(\-?\d+)\]/i.test(tt))
    this.oTime = RegExp.$1/1000;

tt = tt.replace(/\[\:\][^$\n]*(\n|$)/g,"$1");
tt = tt.replace(/\[[^\[\]\:]*\]/g,"");
tt = tt.replace(/\[[^\[\]]*[^\[\]\d]+[^\[\]]*\:[^\[\]]*\]/g,"");
tt = tt.replace(/\[[^\[\]]*\:[^\[\]]*[^\[\]\d\.]+[^\[\]]*\]/g,"");
tt = tt.replace(/<[^<>]*[^<>\d]+[^<>]*\:[^<>]*>/g,"");
tt = tt.replace(/<[^<>]*\:[^<>]*[^<>\d\.]+[^<>]*>/g,"");
while(/\[[^\[\]]+\:[^\[\]]+\]/.test(tt))
{
    tt = tt.replace(/((\[[^\[\]]+\:[^\[\]]+\])+[^\[\r\n]*)[^\[]*/,"\n");
    var zzzt = RegExp.$1;
    /^(.+\])([^\]]*)$/.exec(zzzt);
    var ltxt = RegExp.$2;
    var eft = RegExp.$1.slice(1,-1).split("][");
    for(var ii=0; ii<eft.length; ii++)
    {
      var sf = eft[ii].split(":");
      var tse = parseInt(sf[0],10) * 60 + parseFloat(sf[1]);
      var sso = { t:[] , w:[] , n:ltxt }
      sso.t[0] = tse-this.oTime;
      this.inr[this.inr.length] = sso;
    }
}
this.inr = this.inr.sort( function(a,b){return a.t[0]-b.t[0];} );
for(var ii=0; ii<this.inr.length; ii++)
{
    while(/<[^<>]+\:[^<>]+>/.test(this.inr[ii].n))
    {
      this.inr[ii].n = this.inr[ii].n.replace(/<(\d+)\:([\d\.]+)>/,"%=%");
      var tse = parseInt(RegExp.$1,10) * 60 + parseFloat(RegExp.$2);
      this.inr[ii].t[this.inr[ii].t.length] = tse-this.oTime;
    }
    lrcbc.innerHTML = "<font>"+ this.inr[ii].n.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/%=%/g,"</font><font>") +"</font>";
    var fall = lrcbc.getElementsByTagName("font");
    for(var wi=0; wi<fall.length; wi++)
      this.inr[ii].w[this.inr[ii].w.length] = fall[wi].offsetWidth;
    this.inr[ii].n = lrcbc.innerText;
}
for(var ii=0; ii<this.inr.length-1; ii++)
    this.min[ii] = Math.floor((this.inr[ii+1].t[0]-this.inr[ii].t[0])*10);
this.min.sort(function(a,b){return a-b});
min = this.min[0]/2;
this.run = function(tme)
{
    if(tme<this.dts || tme>=this.dte)
    {
      var ii;
      for(ii=this.inr.length-1; ii>=0 && this.inr[ii].t[0]>tme; ii--){}
      if(ii<0) return;
      this.ddh = this.inr[ii].t;
      this.fjh = this.inr[ii].w;
      this.dts = this.inr[ii].t[0];
      this.dte = (ii<this.inr.length-1)?this.inr[ii+1].t[0]:aboutplayer.currentMedia.duration;

this.print(this.retxt(ii));
      if(this.dlt==ii-1)
      {
        clearTimeout(lrc0);
        if(lrcoll.style.pixelTop!=0) lrcoll.style.top = 0;
        golrcoll(0);
        clearTimeout(lrc1);
        lrcfilter.filters.alpha.opacity = 100;
        golrcolor(0);
      }
      else if(parseInt(lrcoll.style.top)!=-20)
      {
        clearTimeout(lrc0);
        lrcoll.style.top = -20;
        clearTimeout(lrc1);
        lrcfilter.filters.alpha.opacity = 0;
      }
      this.dlt = ii;
    }
    var bbw = 0;
    var ki;
    for(ki=0; ki<this.ddh.length && this.ddh[ki]<=tme; ki++)
      bbw += this.fjh[ki];
    var kt = ki-1;
    var sc = ((ki<this.ddh.length)?this.ddh[ki]:this.dte) - this.ddh[kt];
    var tc = tme - this.ddh[kt];
    bbw -= this.fjh[kt] - tc / sc * this.fjh[kt];
    if(bbw>lrcbox.offsetWidth)
      bbw = lrcbox.offsetWidth;
    lrcbc.style.width = Math.round(bbw);
}
this.retxt = function(i)
{
    return (i<0 || i>=this.inr.length)?"":this.inr[i].n;
}
this.print = function(txt)
{
    lrcbox.innerText = txt;
    lrcbc.innerText = txt;
}
}
function lrcrun()
{
with(aboutplayer)
{
    lrcobj.run(controls.currentPosition);
}
if(arguments.length==0) setTimeout("lrcrun()",10);
}
function golrcoll(s)
{
lrcoll.style.top = -(s++)*2;
if(s<=9)
    lrc0 = setTimeout("golrcoll("+s+")",min*10);
}
function golrcolor(t)
{
lrcfilter.filters.alpha.opacity = 110-(t++)*10;
if(t<=10)
    lrc1 = setTimeout("golrcolor("+t+")",min*10);
}
window.onerror = function()
{return true;}
lrcrun();
</SCRIPT>

本站是提供個(gè)人知識(shí)管理的網(wǎng)絡(luò)存儲(chǔ)空間，所有內(nèi)容均由用戶(hù)發(fā)布，不代表本站觀點(diǎn)。請(qǐng)注意甄別內(nèi)容中的聯(lián)系方式、誘導(dǎo)購(gòu)買(mǎi)等信息，謹(jǐn)防詐騙。如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容，請(qǐng)點(diǎn)擊一鍵舉報(bào)。

轉(zhuǎn)藏 分享

QQ空間 QQ好友新浪微博微信

獻(xiàn)花（0） +1

來(lái)自：情愫秋生 > 《小播放器》

舉報(bào)/認(rèn)領(lǐng)