DIV CSS 佈局教程網

var names;
var Cs, St;
var rorw="";
var lrcT;

function getname(songname){
    if(songname==""){
        names=$("name").value;
    }else{
        names=songname;
    }
    geturl();
}
function geturl(){
    AJAXCALL("inc/songurl.asp?type=url1&keyword="+names,"musiclist","isXML=true");
    addbox(names);
}
function top(){
    AJAXCALL("inc/songlist.asp?ac=new","toplist","isXML=true");
}
function toplist(doc){
    var items=getElementsByClass(doc,"item");
        var linker=new Array();
        var linkers=new Array();
    var tmp="<ul>";
    for(var i=0;i<items.length;i++){
                if(getTagValue(items[i], "singer")=="")
                {
                  linker[i]="";
                  linkers[i]="";   
                }
                else
                {
                  linker[i]="("+getTagValue(items[i], 'singer').replace(/ /g," ")+")";
                  linkers[i]=" "+getTagValue(items[i], 'singer').replace(/ /g," ");
                }
        var d=i+1;
        tmp+='<li>'+d+'. <a href=javascript:getname("'+getTagValue(items[i], 'songname').replace(/ /g," ")+linkers[i]+'") title="'+getTagValue(items[i], 'songname').replace(/ /g," ")+linker[i]+'">'+getTagValue(items[i], 'songname').replace(/ /g," ")+linker[i]+'</a></li>';
    }
    tmp+="</ul>";
    $("toplist").innerHTML=tmp;
}
function s2(){
    AJAXCALL("inc/songlist.asp?ac=all","s3","isXML=true");
}
function s3(doc){
    var items=getElementsByClass(doc,"item");
        var linker=new Array();
        var linkers=new Array();
    var tmp="<ul>";
    for(var i=0;i<items.length;i++){
                if(getTagValue(items[i], "singer")=="")
                {
                  linker[i]="";
                  linkers[i]="";
                }
                else
                {
                  linker[i]="("+getTagValue(items[i], 'singer').replace(/ /g," ")+")";
                  linkers[i]=" "+getTagValue(items[i], 'singer').replace(/ /g," ");
                }
        var d=i+1;
        tmp+='<li>'+d+'. <a href=javascript:getname("'+getTagValue(items[i], 'songname').replace(/ /g," ")+linkers[i]+'") title="'+getTagValue(items[i], 'songname').replace(/ /g," ")+linker[i]+'">'+getTagValue(items[i], 'songname').replace(/ /g," ")+linker[i]+'</a></li>';
    }
    tmp+="</ul>";
    $("topalllist").innerHTML=tmp;
}
function musiclist(doc){
    var items=getElementsByClass(doc,"item");
    var tmp="<ul>";
    for(var i=0;i<22 && i<items.length;i++){
        var d=i+1;
        type=getTagValue(items[i], 'type');
        tmp+='<li> <img src="img/list.gif" /> <a title="試聽點 '+d+' ('+type+')" href=javascript:play("'+getTagValue(items[i], 'type')+'","'+getTagValue(items[i], 'link').replace(/ /g,' ')+'")>'+names.replace(/ /g,' ')+' ('+type+')</a></li>';
    }
    tmp+="</ul>";
    $("list").innerHTML=tmp;
    $("msg").style.display="none";
    play(getTagValue(items[0], "type"),getTagValue(items[0], "link"));
}
function play(obj,url){
        initLrc();
    $("guanxin").style.display="none";
    $("msg").style.display="block";
    AJAXCALL("inc/songurl.asp?type=url2&keyword="+url+"&attach="+obj,"gotoplay","isXML=true");
    AJAXCALL("inc/lyrics.asp?song="+names,"getlrc","isXML=true");
}
var tl;
function getlrc(doc){
    tl="";
    var items=getElementsByClass(doc,"item");
    var tmp="<div id=LrcDiv class=LrcDiv>";
    for(var i=0;i<items.length;i++){
        tmp+='<div class=div id=T_'+getTagValue(items[i], 'time')+' onclick=To(\''+getTagValue(items[i], 'time')+'\')>'+getTagValue(items[i], 'lrc')+'</div>';
        tl+=getTagValue(items[i], 'time')+"|";
    }
    tmp+="</div>";
    $("lrc").innerHTML=tmp;
}

function gotoplay(docs){
    var type=getTagValue(docs, "type");
    var link=getTagValue(docs, "link");
    if(type=="rm" || type=="ra" || type=="ram" || type=="rmvb" || type=="mpga" || type=="mp4" || type=="3gp")
      $("players").innerHTML=realplayer(link);
    else
      $("players").innerHTML=mdplayer(link);
    var link3=cuturl(link);
    $("msg").style.display="none";
    $("wmaurl").innerHTML="歌曲出處: <a href="+link.replace(/ /g," ")+" target='_blank' title='點右鍵另存："+names.replace(/ /g," ")+"'>"+link3.replace(/ /g," ")+"</a>";
    setTimeout(guanxin,1000);
    playobj();
}

function initLrc(){
        clearTimeout(lrcT);
        rorw="";
        $("players").innerHTML="";
        $("lrc").innerHTML="";
    St=0;
        Cs=0;
}

function playobj(){
        if($("MPlayer"))
        {
          rorw="wmp";
          ldL();
        }
        else if($("RPlayer"))
        {
          rorw="rmp";
          try { RPlayer.SetWantErrors(true); } catch(hh){}
          ldL();
        }
        else
          playobj();
}

function guanxin(){
    $("guanxin").style.display="block";
    setTimeout(guanxin2,10000);
}
function guanxin2(){
    $("guanxin").style.display="none";
}

var player;
function mdplayer(str){
player='<object classid="clsid:6bf52a52-394a-11d3-b153-00c04f79faa6" id="MPlayer" width="100%" height="64"><param name="url" value="'+str+'"><param name="enablecontextmenu" value="0"><param name="enableerrordialogs" value="0"></object>';
return player;
}

function realplayer(str){
player='<object classid="clsid:cfcdaa03-8be4-11cf-b84b-0020afbbccfa" id="RPlayer" width="100%" height="60"><param name="src" value="'+str+'"><param name="controls" value="controlpanel,statusbar"><param name="autostart" value="true"></object>';
return player;
}

function cuturl(song_url){
    var len=getStrActualLen(song_url);
    var MAX_DISP_LEN=40;
    if(len<=MAX_DISP_LEN) return song_url;
    var disp_song_url=song_url;
    var pos1=song_url.indexOf("://");
    if(pos1>0){
        disp_song_url=song_url.substring(pos1+3,len);
        var pos2=disp_song_url.indexOf("/");
        if(pos2>0) disp_song_url=song_url.substring(0,pos1+pos2+4);
        var len2=MAX_DISP_LEN-3-getStrActualLen(disp_song_url);
        if(len2>0) disp_song_url=disp_song_url+'...'+song_url.substring(len-len2,len);
        return disp_song_url;
    }
}

function getStrActualLen(sChars){
    return sChars.replace(/[^\x00-\xff]/g,"xx").length;
}

function AJAXCALL(url,handleResponse,param){
    var isXML=false;//false:html or true:xml
    var isCache=false;//false:no-cache or true:cache
    var method="GET";//GET or POST
    var attach="";
    if(param){
        re = / /g; 
        param=param.replace(re, "");
        var tmp=param.split(",");
        for(var i=0;i<tmp.length;i++){
            var pa=tmp[i].substr(0,3);
            var ct=tmp[i].split("=")[1];
            switch (pa){
                case "isX":
                if(ct=="true"){
                    isXML= true; 
                }else{
                    isXML= false; 
                }
                break;
                case "isC":
                if(ct=="true"){
                    isCache= true; 
                }else{
                    isCache= false; 
                }
                break;
                case "met":
                method=ct;
                break;
                case "att":
                attach=ct;
                break;
            }
        }
    }
    if(!isCache){
        var t=new Date().getTime();
        if(url.indexOf("?")>0){
        url+="&t="+t;
        }else{
            url+="?t="+t;
        }
    }    
    var postdata=null;
    if(method=="POST"){
        purl=url.split("?");
        url=purl[0];
        postdata=purl[1];
    }
    RequestHTTP(url,handleResponse,method,isXML,postdata,attach);
}

function RequestHTTP(burl,rdRandleResponse,bmethod,bXML,Formdata,attach){
    var http_request = false;
    function doHttpRequest(){    
        if (window.XMLHttpRequest){
            http_request = new XMLHttpRequest();
            if (http_request.overrideMimeType){
                http_request.overrideMimeType('text/xml');
            }
        } else if (window.ActiveXObject){
            try{
                http_request = new ActiveXObject("Msxml2.XMLHTTP");
            } catch (e){
                try{
                    http_request = new ActiveXObject("Microsoft.XMLHTTP");
                } catch (e){}
            }
        }
        if (!http_request){
            alert('Giving up :( Cannot create an XMLHTTP instance');
            return false;
        }
        http_request.onreadystatechange=handleStateChange;    
        http_request.open(bmethod,burl,true);
        if(Formdata){
            http_request.setRequestHeader("Content-Length",Formdata.length);   
            http_request.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
            http_request.send(Formdata);
        }else{
            http_request.setRequestHeader("Content-Type","text/html");
            http_request.send(null);
        }
    }
    function handleStateChange(){
        if(http_request.readyState==4 && http_request.status==200){
            var response_content;
            if(bXML){
                response_content=http_request.responseXML;
            }else{
                response_content=http_request.responseText;    
            }        
            if(typeof rdRandleResponse == "function"){
                rdRandleResponse(response_content, attach);
            }else{
                eval(rdRandleResponse+"(response_content,attach)");
            }
        }
    }
    doHttpRequest();
}

function getTagValue(doc, tag){
     var elems = doc.getElementsByTagName(tag)[0].firstChild.nodeValue;
     return elems; 
}

function $(obj){
  return document.getElementById(obj);    
}

function getElementsByClass(node,tag){
    var els = node.getElementsByTagName(tag);
    return els;
}
歌詞函數：
復制代碼 代碼如下:
function setcookie(name,value){
    var Days = 30;
    var exp = new Date();
    exp.setTime(exp.getTime() + Days*24*60*60*1000);
    document.cookie = name + "="+ escape(value) +";expires="+ exp.toGMTString();
}
function getcookie(name){
    var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
    if(arr != null) return unescape(arr[2]); return null;
}
setcookie("box",getcookie("box"));
function addbox(name){
    var a1=name+"|*|";
    var box=getcookie("box");
    box=box.replace(a1,"");
    var value=a1+box;
    setcookie("box",value);
    listbox();
}
function delbox(name){
    var del=name+"|*|";
    var s=getcookie("box");
    s = s.replace(del, "");
    setcookie("box",s);
    listbox();
}
function listbox(){
    var tmp="";
    var s2=getcookie("box");
    var s3=s2.split("|*|");
    var s4=s3.length-1;
        if(s4>8) $("boxlist").style.height="139px";
    for(var i=0;i<s4;i++){
        tmp+="<div id=\"box\"><div id=\"del\" style=\"float: right;\"><span onclick=javascript:delbox('"+s3[i]+"')>刪除</span></div><div id=\"boxtitle\"><a href=javascript:getname('"+s3[i]+"')>"+s3[i]+"</a></div></div>";
    }
    $("boxlist").innerHTML=tmp;
}

function GetEBID(id){return document.getElementById(id);}
function To(t){
        if(rorw=="") return;
    if(rorw=="rmp" && RPlayer.GetPlayState()==3) RPlayer.SetPosition(t*1000);
    if(rorw=="wmp" && MPlayer.playState==3) MPlayer.controls.CurrentPosition=t;
}

function lrcrun(){
        var rtl="|"+tl;
        if((rtl.indexOf("|"+Cs+"|")) != -1){
            GetEBID("LrcDiv").scrollTop=GetEBID("LrcDiv").offsetTop-parseInt(GetEBID("LrcDiv").offsetHeight/2)+GetEBID("T_"+Cs).offsetTop+10;
            GetEBID("T_"+St).className="";
            GetEBID("T_"+Cs).className="b";
            St=Cs;
        }
}

function ldL(){
    if(rorw=="rmp" && RPlayer.GetPlayState()==3) {Cs=Math.floor(RPlayer.GetPosition()/1000); lrcrun();}
    if(rorw=="wmp" && MPlayer.playState==3)    {Cs=Math.floor(MPlayer.controls.CurrentPosition); lrcrun();}
    lrcT=setTimeout("ldL()", 10);
}