//方法封裝

function getByClass(claName,parent){

var oParent=parent?document.getElementById(parent):document,

? ?eles=[],

? ?elements=oParent.getElementsByTagName("*");

for(var i=0,l=elements.length;i<l;i++){

if(elements[i].className==claName){

eles.push(elements[i]);

}

}

return eles;

}

//頁面加載

window.onload=link;

function link(){

var oTitle=getByClass("login_logo_webqq","loginPanel")[0];

//拖曳

oTitle.onmousedown=fnDown;

//關閉

var oClose=document.getElementById("ui_boxyClose");

oClose.onclick=function(){

document.getElementById("loginPanel").style.display="none";

}

//切換狀態

var loginState=document.getElementById("loginState"),

? ?stateList=document.getElementById("loginStatePanel"),

? ?lis=stateList.getElementsTagName("li"),

? ?stateTxt=document.getElementById("login2qq_state_txt"),

? ?q=document.getElementById("loginStateShow");

loginState.onclick=function(){

stateList.style.display="block";

//鼠標劃過、離開和點擊狀態列表時

for(var i=0,l=lis.length;i<l;i++){

lis[i].onmouseover=function(){

this.style.background="#567";

}

}

}

}

function fnDown(){

var oDrag=document.getElementById("loginPanel");

/*這里有一個bug，松開光標時，光標出現在面板右上角，所以不這樣去寫

* document.onmousemove=function(event){

event=event||window.event;

//document.title=event.clientX+","+event.clientY;

oDrag.style.left=event.clientX+"px";

oDrag.style.top=event.clientY+"px";

}*/

event=event||window.event;

//光標按下時，光標與面板之間的距離

var disX=event.clientX-oDrag.offsetLeft,

? ?disY=event.clientY-oDrag.offsetTop;

? ? //移動

document.onmousemove=function(event){

event=event||window.event;

fnMove(event,disX,disY);

? ?}

//釋放按鈕

document.onmouseup=function(){

document.onmousemove=null;

document.onmouseup=null;

? ?}

}

function fnMove(e,posX,posY){

var oDrag=document.getElementById("loginPanel"),

? ?w=e.clientX-posX,

? ?h=e.clientY-posY,

? ?winW=document.documentElement.clientWidth||document.body.clientWidth,

? ?winH=document.documentElement.clientHeight||document.body.clientHeight,

? ?maxW=winW-oDrag.offsetWidth-10,//這里10px為X按鈕的大小

? ?maxH=winH-oDrag.offsetHeight;

if(w<0){

w=0;

}else if(w>maxW){

w=maxW;

}

if(h<0){

h=10;

}else if(h>maxH){

h=maxH;

}

oDrag.style.left=w+"px";

oDrag.style.top=h+"px";

//document.title=w;

}