摔!!明明是按照视频一条一条写的啊..写到有bug的那个还能拖曳,然后改完之后就拖不动了...
//封装通过class获取元素的函数
function getByClass(clName,parent){
//首先把父元素取出来,如果传了父元素,那么我们希望返回的是父元素的id,如果没有传,那么父元素就是document
var oParent=parent?document.getElementById(parent):document,
//定义一个数组,这个数组将用来装从所有元素中取到的有改class的元素
eles=[],
//取出所有元素
elements=document.getElementsByTagName('*');
for (var i = 0; i < elements.length; i++) {
eles.push(elements[i]);
}
//返回我们取到的数组
return eles;
}
window.onload=drag;
//整个拖曳过程分为三步
//1、确定用户点击的是log部分的区域
function drag(){
//用getByClass取到改div
var oTitle=getByClass("login_logo_webqq","loginPanel")[0];
//onmousedown鼠标点击时发生
oTitle.onmousedown=fnDown;
}
function fnDown(event){
event=event||window.event;//兼容
//把整个面板取出来
var oDrag=document.getElementById('loginPanel'),
//光标按下时光标和面板之间的距离
disX=event.clientX-oDrag.offsetLeft,
disY=event.clientY-oDrag.offsetTop;
//移动
document.onmousemove=function(event){
event=event||window.event;
fnMove(event,disX.disY);
};
}
function fnMove(e,posX,posY){
var oDrag=document.getElementById('loginPanel'),
l=e.clientX-posX,
t=e.clientY-posY;
oDrag.style.left=l+"px";
oDrag.style.top=t+"px";
}可以chrom按F12查看错误信息哦~~!
for (var i = 0; i < elements.length; i++) {
if(elements[i].className == clsName){
eles.push(elements[i]);
}
}
写掉了一句!