QQ漂浮客服代码_微信公众号/小程序开发

夜鹰教程网-程序员的加油站

·设为首页·加入收藏

本站首页技术文章全套前端云课堂智慧校园

你好，欢迎来到夜鹰网！【去购买教程】

当前位置：文章中心 >> 微信公众号/小程序开发

QQ漂浮客服代码

夜鹰教程网来源：www.yyjcw.com 日期：2016-10-25 20:18:42

ont size="3">第二步：按橙色说明修改<html><head><meta http-equiv="Content-Type" c>...

第一步：先把以下代码保存为kefu.htm（不包括说明文字）
第二步：按橙色说明修改
<html>
<head>
<meta http-equiv="Content-Type" c>
<link rel="stylesheet" href="images/ im.css" type="text/css">
</head>
<script>
var online= new Array();
if (!document.layers)
document.write('<div id="divStayTopLeft" style="position:absolute">')
</script>
<layer id="divStayTopLeft">
<table border="0" width="110" cellspacing="0" cellpadding="0">
<tr><td width="110"><img border=0 src=images/kefu_up.gif></td></tr>
<script src="http://webpresence.qq.com/getonline?Type=1&27089965:27043921:56129874:"></script>
将QQ修改成你的所有客服QQ，多个QQ用半角冒号隔开，最后一个QQ号后面也必须以半角冒号结束

以下部分显示第1个客服QQ，注意：online[0]
<tr><td valign=middle
background=images/kefu_middle.gif>
<script>
if (online[0]==0)
document.write("  <img src=images/QQoffline.gif border=0 align=middle><a class='qqb' target=blank href='http://wpa.qq.com/msgrd?V=1&Uin=27089965&Site=在线咨询&Menu=no' title='客服不在线，请留言'>售前咨询</a>");
else
document.write("  <img src=images/QQonline.gif border=0 align=middle><a class='qqa' target=blank href='http://wpa.qq.com/msgrd?V=1&Uin=27089965&Site=在线咨询&Menu=no' title='在线即时交谈'>售前咨询</a>");
</script >
</td></tr>

以下部分显示第2个客服QQ，注意：online[1]
<tr><td valign=middle
background=images/kefu_middle.gif>
<script>
if (online[1]==0)
document.write("  <img src=images/QQoffline.gif border=0 align=middle><a class='qqb' target=blank href='http://wpa.qq.com/msgrd?V=1&Uin=27043921&Site=在线咨询&Menu=no' title='客服不在线，请留言'>技术支持</a>");
else
document.write("  <img src=images/QQonline.gif border=0 align=middle><a class='qqa' target=blank href='http://wpa.qq.com/msgrd?V=1&Uin=27043921&Site=在线咨询&Menu=no' title='在线即时交谈'>技术支持</a>");
</script >
</td></tr>

以下部分显示第3个客服QQ，注意：online[2]。

<tr><td valign=middle
background=images/kefu_middle.gif>
<script>
if (online[2]==0)
document.write("  <img src=images/QQoffline.gif border=0 align=middle><a class='qqb' target=blank href='http://wpa.qq.com/msgrd?V=1&Uin=240434782&Site=在线咨询&Menu=no' title='客服不在线，请留言'>代理合作</a>");
else
document.write("  <img src=images/QQonline.gif border=0 align=middle><a class='qqa' target=blank href='http://wpa.qq.com/msgrd?V=1&Uin=240434782&Site=在线咨询&Menu=no' title='在线即时交谈'>代理合作</a>");
</script >
</td></tr>

多个QQ，按以上规律复制上面的代码后修改online[0] 中的数字（第1个QQ为online[0]、第2个QQ为online[1]、第3个为online[2]，以此类推）和QQ号（每组代码中有2处位置改为QQ号、2处位置改为昵称）。

<tr><td width="110"><img border=0 src=images/kefu_down.gif></td></tr>
</table>
</layer>
<script type="text/javascript">
//Enter "frombottom" or "fromtop"
var verticalpos="frombottom"
if (!document.layers)
document.write('</div>')
function JSFX_FloatTopDiv()
{
下面的var startX =3是水平位置，250是垂直位置；默认情况在屏幕左侧显示，若要改为右侧显示，修改3的值（var startX =3改为var startX =screen.width-150）即可。

var startX =3,

startY = 250;

var ns = (navigator.appName.indexOf("Netscape") != -1);

var d = document;

function ml(id)

{

var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];

if(d.layers)el.style=el;

el.sP=function(x,y){this.style.left=x;this.style.top=y;};

el.x = startX;

if (verticalpos=="fromtop")

el.y = startY;

else{

el.y = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;

el.y -= startY;

}

return el;

}

window.stayTopLeft=function()

{

if (verticalpos=="fromtop"){

var pY = ns ? pageYOffset : document.body.scrollTop;

ftlObj.y += (pY + startY - ftlObj.y)/8;

}

else{

var pY = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;

ftlObj.y += (pY - startY - ftlObj.y)/8;

}

ftlObj.sP(ftlObj.x, ftlObj.y);

setTimeout("stayTopLeft()", 10);

}

ftlObj = ml("divStayTopLeft");

stayTopLeft();
}
JSFX_FloatTopDiv();
</script>
</html>
第三步：下载相关素材(在图片上点右键－图片另存为…)，保存到images目录下。

http://imis.qq.com/images/wpa/images/kefu_up.gif
http://imis.qq.com/images/wpa/images/kefu_middle.gif
http://imis.qq.com/images/wpa/images/kefu_down.gif
http://imis.qq.com/images/wpa/images/QQonline.gif
http://imis.qq.com/images/wpa/images/QQoffline.gif
http://imis.qq.com/css/im.css
第四步：将所有文件和目录保持原有结构（kefu.htm和文件夹images），拷贝到您的网站目录中，在你要添加“浮动QQ在线客服”的页面的最后面添加一行：

复制链接网友评论收藏本文关闭此页

上一条： QQ校友和校内网竞争白热化下一条：老少沉迷网络游戏半夜忙“偷菜”

夜鹰教程网成立于2008年，目前已经运营了将近 13 年，发布了大量关于 html5/css3/C#/asp.net/java/python/nodejs/mongodb/sql server/android/javascript/mysql/mvc/easyui/vue/echarts原创教程。我们一直都在坚持的是：认证负责、一丝不苟、以工匠的精神来打磨每一套教程，让读者感受到作者的用心。我们默默投入的时间，确保每一套教程都是一件作品，而不是呆板的文字和视频！目前我们推出在线辅导班试运营，模式为一对一辅导，教学工具为QQ。我们的辅导学科包括 java 、android原生开发、webapp开发、商城开发、C#和asp.net开发，winform和物联网开发、web前端开发，但不仅限于此。普通班针对的是国内学员，例如想打好基础的大学生、想转行的有志青年、想深入学习的程序员、想开发软件的初学者或者业余爱好者等。就业办针对即将毕业上岗的大四学生，或者打算转行的初级开发工程师。留学生班针对的是在欧美、加拿大、澳洲、日本、韩国、新加坡等地留学的中国学子，目的是让大家熟练地掌握编程技能，按时完成老师布置的作业，并能顺利地通过考试。详细咨询QQ：1416759661 夜鹰教程网