js QQ客服悬浮效果实现代码
代码:
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxmlns="http://www.w3.org/1999/xhtml"> <head> <metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/> <title>QQ客服悬浮特效代码_www.nhooo.com</title> </head> <bodystyle="height:2000px;"> <scripttype="text/javascript"> window.onload=window.onresize=window.onscroll=function() { varoBox=document.getElementById("qqbox_zzjs"); varoLine=document.getElementById("online_lanrenzhijia"); varoMenu=document.getElementById("menu_zzjs_net"); variScrollTop=document.documentElement.scrollTop||document.body.scrollTop; setTimeout(function() { clearInterval(oBox.timer); variTop=parseInt((document.documentElement.clientHeight-oBox.offsetHeight)/2)+iScrollTop; oBox.timer=setInterval(function() { variSpeed=(iTop-oBox.offsetTop)/8; iSpeed=iSpeed>0?Math.ceil(iSpeed):Math.floor(iSpeed); oBox.offsetTop==iTop?clearInterval(oBox.timer):(oBox.style.top=oBox.offsetTop+iSpeed+"px"); },30) },100) oBox.onmouseover=function() { this.style.width=131+"px"; oLine.style.display="block"; oMenu.style.display="none"; }; oBox.onmouseout=function() { this.style.width=''; oLine.style.display="none"; oMenu.style.display="block"; }; }; document.write("<style>img{border:0;}ul,li{padding:0;margin:0;}.box_lanrenzhijia{z-index:99;right:0;width:128px;height:195px;position:absolute;}.box_lanrenzhijia.press{right:0;width:36px;cursor:pointer;position:absolute;height:128px;}.box_lanrenzhijia.zzjs_net_list{left:0;width:131px;position:absolute;height:195px;background:url(images/20120321lanrenzhijia_1.gif)no-repeatleftcenter;}.box_lanrenzhijia.zzjs_net_listul{padding:37px0021px;}.box_lanrenzhijia.zzjs_net_listli{height:26px;margin-bottom:3px;_margin-bottom:3px;list-style-type:none;}</style><divclass=\"box_lanrenzhijia\"id=\"qqbox_zzjs\"><divclass=\"zzjs_net_list\"id=\"online_lanrenzhijia\"style=\"display:none;\"><ul><li><ahref=\"http://wpa.qq.com/msgrd?V=1&Uin=123456789&Site=毛票票&Menu=yes\"><imgsrc=\"images/20111126lanrenzhijia_3.gif\"alt=\"毛票票一号客服\"></a></li><li><ahref=\"http://wpa.qq.com/msgrd?V=1&Uin=123456789&Site=毛票票&Menu=yes\"><imgsrc=\"images/20111126lanrenzhijia_3.gif\"alt=\"毛票票二号客服\"></a></li><li><ahref=\"http://wpa.qq.com/msgrd?V=1&Uin=123456789&Site=毛票票&Menu=yes\"><imgsrc=\"images/20111126lanrenzhijia_3.gif\"alt=\"毛票票三号客服\"></a></li><li><ahref=\"http://wpa.qq.com/msgrd?V=1&Uin=123456789&Site=毛票票&Menu=yes\"><imgsrc=\"images/20111126lanrenzhijia_3.gif\"alt=\"毛票票四号客服\"></a></li><li><ahref=\"http://wpa.qq.com/msgrd?V=1&Uin=123456789&Site=毛票票&Menu=yes\"><imgsrc=\"images/20111126lanrenzhijia_3.gif\"alt=\"毛票票五号客服\"></a></li></ul></div><divid=\"menu_zzjs_net\"><imgsrc=\"images/20111126lanrenzhijia_4.gif\"class=\"press\"alt=\"在线客服\"></div></div>"); </script> </body> </html>