// JavaScript Document

//封裝一個(gè)調(diào)用類名的方法,以適用于所有瀏覽器

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;

}

//實(shí)現(xiàn)拖拽

window.onload=drag;

//提取相應(yīng)類名的元素

function drag(){

var title=getByClass('login_logo_webqq','loginPanel')[0];//取標(biāo)題區(qū)

title.onmousedown=fnDown; //onmousedown：在用戶按下任何鼠標(biāo)按鈕時(shí)觸發(fā)

}

// 事件

function fnDown(event){

document.onmousemove=function(event){//mousemove：當(dāng)鼠標(biāo)指針在元素內(nèi)部移動(dòng)是重復(fù)的觸發(fā)

event=event||window.event;

//定義登錄面板

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

//光標(biāo)按下的位置與面板左上角之間的距離

disX=event.clientX-drag.offsetLeft;

disY=event.clientY-drag.offsetTop;

//移動(dòng)

document.onmousemove=function(event){

event=event||window.event;

fnMove(event,disX,disY);

}

//鼠標(biāo)移動(dòng)時(shí)的臨時(shí)坐標(biāo)

function fnMove(e,mX,mY){

//獲取面板元素

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

//面板移動(dòng)的水平距離

var X=clientX-mX,

//移動(dòng)的垂直距離

Y=clientY-mY;

//將面板移動(dòng)到移動(dòng)后的面板坐標(biāo)

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

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

}

}

}