QQ在线客服代码

网站特效主机域名网站建设站长导航热门事件阜阳校内

网页特效分类：其它游戏娱乐计算转换表单及按钮广告代码浏览器相关图片特效日期时间表格相关文本链接背景特效层和布局菜单导航

您的当前位置：网页特效 > 广告代码 > 正文

QQ在线客服代码

分类标签：广告代码　更新时间：10-05-03　阅读次数：
精致的网页右侧浮动的腾讯QQ在线客服，一些企业类网站经常会用到这种功能，本款不但响应鼠标动作，而且还是一个折叠菜单，支持更多内容的客服号码，非常不错哦。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>右侧悬浮的QQ在线客服-www.codefans.net</title> <meta http-equiv="content-type" content="text/html;charset=gb2312"> <style type="text/css"> .qqbox a:link { color: #000; text-decoration: none; } .qqbox a:visited { color: #000; text-decoration: none; } .qqbox a:hover { color: #f80000; text-decoration: underline; } .qqbox a:active { color: #f80000; text-decoration: underline; } .qqbox{ width:132px; height:auto; overflow:hidden; position:absolute; right:0; top:100px; color:#000000; font-size:12px; letter-spacing:0px; } .qqlv{ width:25px; height:256px; overflow:hidden; position:relative; float:right; z-index:50px; } .qqkf{ width:120px; height:auto; overflow:hidden; right:0; top:0; z-index:99px; border:6px solid #138907; background:#fff; } .qqkfbt{ width:118px; height:20px; overflow:hidden; background:#138907; line-height:20px; font-weight:bold; color:#fff; position:relative; border:1px solid #9CD052; cursor:pointer; text-align:center; } .qqkfhm{ width:112px; height:22px; overflow:hidden; line-height:22px; padding-right:8px; position:relative; margin:3px 0; } .bgdh{ width:102px; padding-left:10px; } </style> </head> <body> <div class="qqbox" id="divQQbox"> <div class="qqlv" id="meumid" onmouseover="show()"><img src="http://www.codefans.net/jscss/demoimg/200905/qq.gif"></div> <div class="qqkf" style="display:none;" id="contentid" onmouseout="hideMsgBox(event)"> <div class="qqkfbt" onmouseout="showandhide('qq-','qqkfbt','qqkfbt','K',5,1);" id="qq-1" onfocus="this.blur();">客服中心</div> <div id="K1"> <div class="qqkfhm bgdh"> <a href="tencent://message/?uin=12345678" title="源码爱好者"><img src="http://wpa.qq.com/pa?p=1:12345678:4" border="0">源码爱好者</a><br/></div> <div class="qqkfhm bgdh"> <a href="tencent://message/?uin=12345678" title="源码爱好者"><img src="http://wpa.qq.com/pa?p=1:12345678:4" border="0">源码爱好者</a></div> <div class="qqkfhm bgdh">手机：13922222222</div> </div> <div class="qqkfbt" onClick="showandhide('qq-','qqkfbt','qqkfbt','K',5,2);" id="qq-2" onfocus="this.blur();">财务充值</div> <div id="K2" style="display:none"> <div class="qqkfhm bgdh"> <a href="tencent://message/?uin=12345678" title="源码爱好者"><img src="http://wpa.qq.com/pa?p=1:12345678:4" border="0">源码爱好者</a><br/></div> <div class="qqkfhm bgdh"> <a href="tencent://message/?uin=12345678" title="源码爱好者"><img src="http://wpa.qq.com/pa?p=1:12345678:4" border="0">源码爱好者</a></div> <div class="qqkfhm bgdh">手机：13955432222</div> </div> <div class="qqkfbt" onClick="showandhide('qq-','qqkfbt','qqkfbt','K',5,3);" id="qq-3" onfocus="this.blur();">机房值班</div> <div id="K3" style="display:none"> <div class="qqkfhm bgdh"> <a href="tencent://message/?uin=12345678" title="源码爱好者"><img src="http://wpa.qq.com/pa?p=1:12345678:4" border="0">源码爱好者</a><br/></div> <div class="qqkfhm bgdh"> <a href="tencent://message/?uin=12345678" title="源码爱好者"><img src="http://wpa.qq.com/pa?p=1:12345678:4" border="0">源码爱好者</a></div> <div class="qqkfhm bgdh">手机：13222235523</div> </div> <div class="qqkfbt" onClick="showandhide('qq-','qqkfbt','qqkfbt','K',5,4);" id="qq-4" onfocus="this.blur();">渠道咨询</div> <div id="K4" style="display:none"> <div class="qqkfhm bgdh"> <a href="tencent://message/?uin=12345678" title="源码爱好者"><img src="http://wpa.qq.com/pa?p=1:12345678:4" border="0">源码爱好者</a><br/></div> <div class="qqkfhm bgdh"> <a href="tencent://message/?uin=12345678" title="源码爱好者"><img src="http://wpa.qq.com/pa?p=1:12345678:4" border="0">源码爱好者</a></div> <div class="qqkfhm bgdh">手机：13222225523</div> </div> <div class="qqkfbt" onClick="showandhide('qq-','qqkfbt','qqkfbt','K',5,5);" id="qq-5" onfocus="this.blur();">投诉建议</div> <div id="K5" style="display:none"> <div class="qqkfhm bgdh"> <a href="tencent://message/?uin=12345678" title="源码爱好者"><img src="http://wpa.qq.com/pa?p=1:12345678:4" border="0">源码爱好者</a><br/></div> <div class="qqkfhm bgdh"> <a href="tencent://message/?uin=12345678" title="源码爱好者"><img src="http://wpa.qq.com/pa?p=1:12345678:4" border="0">源码爱好者</a></div> <div class="qqkfhm bgdh">手机：13952222523</div> </div> </div> </div> <script language="javascript"> function showandhide(h_id,hon_class,hout_class,c_id,totalnumber,activeno) { var h_id,hon_id,hout_id,c_id,totalnumber,activeno; for (var i=1;i<=totalnumber;i++) { document.getElementById(c_id+i).style.display='none'; document.getElementById(h_id+i).className=hout_class; } document.getElementById(c_id+activeno).style.display='block'; document.getElementById(h_id+activeno).className=hon_class; } var tips; var theTop = 100; var old = theTop; function initFloatTips() { tips = document.getElementById('divQQbox'); moveTips(); } function moveTips() { var tt=50; if (window.innerHeight) { pos = window.pageYOffset }else if (document.documentElement && document.documentElement.scrollTop) { pos = document.documentElement.scrollTop }else if (document.body) { pos = document.body.scrollTop; } //http: pos=pos-tips.offsetTop+theTop; pos=tips.offsetTop+pos/10; if (pos < theTop){ pos = theTop; } if (pos != old) { tips.style.top = pos+"px"; tt=10;//alert(tips.style.top); } old = pos; setTimeout(moveTips,tt); } initFloatTips(); if(typeof(HTMLElement)!="undefined")//给firefox定义contains()方法，ie下不起作用 { HTMLElement.prototype.contains=function (obj) { while(obj!=null&&typeof(obj.tagName)!="undefind"){// 　　　if(obj==this) return true; 　　　　obj=obj.parentNode; 　　 } return false; } } function show() { document.getElementById("meumid").style.display="none" document.getElementById("contentid").style.display="block" } function hideMsgBox(theEvent){ if (theEvent){ var browser=navigator.userAgent; if (browser.indexOf("Firefox")>0){//Firefox if (document.getElementById("contentid").contains(theEvent.relatedTarget)) { return } } if (browser.indexOf("MSIE")>0 || browser.indexOf("Presto")>=0){ if (document.getElementById('contentid').contains(event.toElement)) { return;//结束函式 } } } document.getElementById("meumid").style.display = "block"; document.getElementById("contentid").style.display = "none"; } </script> </body> </html>
提示:可以修改后运行.

本类推荐特效代码

QQ在线客服JS代码，自适应漂浮在网页右侧

QQ在线客服代码

本类推荐特效代码

本类特效代码阅读排行

本类最新特效代码