// 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';

}

}

}