// JavaScript Document

//封裝一個調用類名的方法,以適用于所有瀏覽器

function getByClass(class,patent){//class是必須的，parent不是必須的

var pare=parent?document.getElementById(parent):document,//判斷是否有父元素

eles=[],//有相同className的元素的集合

elements=pare.getElemetsByTagName('*');//所有取出的父元素下的元素

//遍歷

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

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

eles.push(elements[i]);

}

}

return eles;

}

//實現拖拽

window.onload=drag;

//提取相應類名的元素

function drag(){

var title=getByClass('login_logo_webqq','loginPanel')[0];//取標題區

title.onmousedown=fnDown; //onmousedown：在用戶按下任何鼠標按鈕時觸發

}

// 事件

function fnDown(event){

document.onmousemove=function(event){//mousemove：當鼠標指針在元素內部移動是重復的觸發

event=event||window.event;

//定義登錄面板

var drag=document.getElementById('loginPanel');

//光標按下的位置與面板左上角之間的距離

disX=event.clientX-drag.offsetLeft;

disY=event.clientY-drag.offsetTop;

//移動

document.onmousemove=function(event){

event=event||window.event;

fnMove(event,disX,disY);

}

//鼠標移動時的臨時坐標

function fnMove(e,mX,mY){

//獲取面板元素

var drag=document.getElementById('loginPanel');

//面板移動的水平距離

var X=clientX-mX,

//移動的垂直距離

Y=clientY-mY;

//將面板移動到移動后的面板坐標

drag.style.left=X+'px';

drag.atyle.top=Y+'px';

}

}

}