这是老师讲课的连接,就是这一节里面的内容 以下是我写的JS代码,我没检查出来,但是结果是我一点击页面想拖动,它就不见了,我用的是猎豹浏览器 //封装通过找到class获取元素 function getByClass(clsName,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==clsName){ eles.push(elements[i]) }} return eles; } // window.onload=drag; //获取class元素进行onmousedown事件,并且再鼠标按下的时候进行fnDown函数 function drag(){ var oTitle=getByClass('login_logo_webqq','loginPanel')[0]; oTitle.onmousedown=fnDown; //关闭 } //获取id元素,利用id元素跟随光标坐标 function fnDown(event){ event= event || window.event; var oDrag=document.getElementById('loginPanel'), disX=event.clientX-oDrag.offsetLeft, disY=event.clientY-oDrag.offsetTop; oDrag.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, winW=document.documentElement.clientWidth||document.body.clientWidth, winH=document.documentElement.clientHight||document.body.clientHeight, maxW=winW-oDrag.offsetWidth, maxH=winH-oDrag.offsetHeight; if(l<0){ l=0 }else if(l>maxW){ l=maxW; }; if(t<0){ t=0 }else if(t>maxH){ t=maxH; }; oDrag.style.left=l+'px'; oDrag.style.top=t+'px'; } // JavaScript Document
相关分类