function getClass(clsName,parent){
var oParent=parent?document.getElementById(parent):document,
eles=[],
ele=oParent.getElementsByTagName('*');
for (var i = 0,len=ele.length; i<1; i++) {
if (ele[i].className===clsName) {
eles.push(ele[i]);
}
}
return eles;
}
window.onload=drag;
function drag(){
var close=getClass('close','ding')[0];//返回的是数组,所以一定要加后缀
var area=document.getElementById('webqq');//移动区域
var name=document.getElementById('need');//账号框处理
var state=document.getElementById('state');
var shows=document.getElementById('shows');
var txt=document.getElementById('txt');
var panel=document.getElementById('panel');
var lis=panel.getElementsByTagName('li');
close.onclick=unShow; //关闭qq面板
area.onclick=fnDown; //确定鼠标位置与面板边框的距离
name['onfocus']=hiddenTxt; //账号框处理
name['onblur']=showTxt; //账号框处理
//状态列表下拉
state.onclick=function(e){
e=e||window.event;
showList(e);
}
//列表项样式设计,包括划过 划出和点击,其中点击主要是用来变换状态用的
for(var i=0,len=lis.length;i<len;i++){
lis[i].onmouseover=function(){
this.style.background='#567';
}
lis[i].onmouseout=function(){
this.style.background='#fff';
}
lis[i].onclick=function(e){
e=e||window.event;
//一定要阻止事件冒泡,firstly
if(e.stopPropagation){
e.stopPropagation();
}else{
e.cancelBubble=true;
}
var id=this.id;
var L=document.getElementById(id),
cTxt=L.getElementsByTagName('div')[0].innerHTML;
panel.style.display='none';
txt.innerHTML=cTxt;
shows.className='';
shows.className='logo-state-show '+id;
}
}
document.onclick=function(){
panel.style.display='none';
}
}
//关闭QQ面板
function unShow(){
document.getElementById('box').style.display='none';
}
//账号栏设计
function hiddenTxt(){
if (this.value=='QQ号码或E-Mail') {
this.value='';
}
}
function showTxt(){
if (this.value=='') {
this.value='QQ号码或E-Mail';
}
}
//下拉表显现
function showList(e){
e=e||window.event;
//用于防止事件冒泡,因为上面有点击事件
if(e.stopropagation){
e.stopropagation();
}else{
e.cancelBubble=true;
}
panel.style.display='block';
state.style.height="300"+"px";
}
//开始拖动
function fnDown(event){
event=event||window.event;
var area=document.getElementById('box'),
webq=document.getElementById('webqq');
disX=event.clientX-area.offsetLeft,
disY=event.clientY-area.offsetTop;
//鼠标移动
webq.onmousemove=function(event){
event=event||window.event;
fnMove(event,disX,disY);
}
//释放鼠标,无效,why?
webq.onmouseout=function(){
webq.onmousemove=null;
webq.onmouseup=null;
}
}
function fnMove(e,posX,posY){
var area=document.getElementById('box');
var wid=e.clientX-posX;
var het=e.clientY-posY;
var Width=document.documentElement.clientWidth||document.body.clientWidth;
var Height=document.documentElement.clientHeight||document.body.clientHeight;
var maxWid=Width-area.offsetWidth-10;
var maxHeight=Height-area.offsetHeight;
if (wid<=0) {
wid=0;
}else if (wid>maxWid) {
wid=maxWid;
}
if (het<0) {
het=10;
}else if (het>maxHeight) {
het=maxHeight-16;
}
//一定要有单位“px”,否则下列赋值无效
area.style.top=het+'px';
area.style.left=wid+'px';
}
webq.onmouseout=function(){
webq.onmousemove=null;
webq.onmouseup=null;
}
因为你没有onmouseup函数
webq.onmouseout=function(){。。。} 你应该想写 webq.onmouseup=...... 吧