给网站加一个浮动的客户在线助手

admin · 发表于 2008-5-6 08:26:43

代码如下：
<div id=\"divStayTopleft\" style=\"right:10px

OSITION:absolute;TOP:69px;\">
<table width=\"109\" height=\"188\" border=\"0\" cellpadding=\"0\" cellspacing=\"0\">
<tr><td colspan=\"3\"><a onClick=\"CloseQQ()\" href=\"javascript:;\" shape=\"circle\" coords=\"91,16,12\">
         <img height=\"34\" src=\"images/qq_top.gif\" width=\"109\" usemap=\"#Map\" border=\"0\"></a></td>
</tr>
<tr><td width=\"6\" background=\"images/qq_life.gif\"></td>
<td><table width=\"96\" height=\"100\" border=\"0\" cellpadding=\"4\" cellspacing=\"0\" bgcolor=\"#FFFFFF\">
   <tr>
      <td align=\"center\"><a target=blank href=tencent://message/?uin=320133806;Site=嘉缘官方;Menu=yes><img border=\"0\" SRC=http://wpa.qq.com/pa?p=1:320133806:10 alt=\"技术支持\"></a></td>
   </tr>
   <tr><td align=\"center\"><a target=blank href=tencent://message/?uin=320133806;Site=嘉缘官方;Menu=yes><img border=\"0\" SRC=http://wpa.qq.com/pa?p=1:320133806:10 alt=\"技术支持\"></a></td>
   </tr>
   <tr><td align=\"center\"><a target=blank href=tencent://message/?uin=320133806;Site=嘉缘官方;Menu=yes><img border=\"0\" SRC=http://wpa.qq.com/pa?p=1:320133806:10 alt=\"技术支持\"></a></td>
   </tr>
   <tr>
      <td align=\"center\"><a target=blank href=tencent://message/?uin=320133806;Site=嘉缘官方;Menu=yes><img border=\"0\" SRC=http://wpa.qq.com/pa?p=1:320133806:10 alt=\"技术支持\"></a></td>
   </tr>
   <tr><td align=\"center\"><a target=blank href=tencent://message/?uin=320133806;Site=嘉缘官方;Menu=yes><img border=\"0\" SRC=http://wpa.qq.com/pa?p=1:320133806:10 alt=\"技术支持\"></a></td>
   </tr>
   <tr><td align=\"center\"><a target=blank href=tencent://message/?uin=320133806;Site=嘉缘官方;Menu=yes><img border=\"0\" SRC=http://wpa.qq.com/pa?p=1:320133806:10 alt=\"技术支持\"></a></td>
   </tr>
</table></td>
<td width=\"7\" background=\"images/qq_right.gif\"></td>
</tr>
<tr><td height=\"30\" colspan=\"3\">
         <img height=\"30\" src=\"images/qq_bottom1.gif\" width=\"109\"></td>
</tr>
<tr><td colspan=\"3\"><img height=\"33\" src=\"images/qq_logo.gif\" width=\"109\"></td>
</tr>
</table>
</div>
<script type=\"text/javascript\">
function CloseQQ()
{
divStayTopleft.style.display=\"none\";
return true;
}
var online= new Array();
lastScrollY=0;
function heartBeat(){
var diffY;
if (document.documentElement ;; document.documentElement.scrollTop)
diffY = document.documentElement.scrollTop;
else if (document.body)
diffY = document.body.scrollTop
else
{/*Netscape stuff*/}

//alert(diffY);
percent=.1*(diffY-lastScrollY);
if(percent>0)percent=Math.ceil(percent);
else percent=Math.floor(percent);
document.getElementById(\"divStayTopLeft\").style.top=parseInt(document.getElementById(\"divStayTopLeft\").style.top)+percent+\"px\";
lastScrollY=lastScrollY+percent;
}
window.setInterval(\"heartBeat()\",1);
</script>
请将以上代码中<a target=blank href=tencent://message/?uin=320133806;Site=嘉缘官方;Menu=yes><img border=\"0\" SRC=http://wpa.qq.com/pa?p=1:320133806:10 alt=\"技术支持\"></a>里的“uin=320133806&Site=嘉缘官方”以及“p=1:320133806:10 alt="技术支持"”带下划线部分修改成你自己的相关内容，然后将完整的代码插入到网站页面代码的<body></body>里。
再将附件中的图片文件上传到网站空间里的images目录
这样一个浮动客服助手就可以出现在你的网站中了
赶快试试吧！

查看效果：http://demo.finereason.com

水山小村 · 发表于 2008-5-6 09:27:47

好东西

yquan · 发表于 2008-5-15 03:01:39

是放到每一个页面吗?

职业杀手 · 发表于 2008-5-28 11:12:14

我只用53kf 不用别的

yaya725 · 发表于 2009-2-23 09:44:07

sdymw · 发表于 2009-2-23 17:18:40

学习了

花宝宝 · 发表于 2009-2-24 09:55:54

这个东西的确很方便的

198zx · 发表于 2009-3-3 09:13:11

这个东西的确很方便的
花宝宝发表于 2009-2-24 09:55

jude_kun · 发表于 2009-3-12 12:11:24

附件不能下载了，演示站点上又没有。
有谁可以把图标放上来一下？

jude_kun · 发表于 2009-3-21 11:33:21

本帖最后由 jude_kun 于 2009-3-21 11:39 编辑

既然没有人有，我就自己稍微修改了下：
效果可到http://www.0762bc.com观看
<div id=\\\"divStayTopleft\\\" style=\\\"right:10pxOSITION:absolute;TOP:69px;\\\">
<table width=\\\"110\\\" height=\\\"148\\\" border=\\\"0\\\" cellpadding=\\\"0\\\" cellspacing=\\\"0\\\">
<tr><td colspan=\\\"3\\\"><a href=\\\"javascript:;\\\" shape=\\\"circle\\\" coords=\\\"91,16,12\\\">
         <img height=\\\"70\\\" src=\\\"http://www.0762bc.com/images/qq_top.gif\\\" width=\\\"110\\\" usemap=\\\"#Map\\\" border=\\\"0\\\"></a></td>
</tr>
<td><table width=\\\"110\\\" height=\\\"60\\\" border=\\\"0\\\" cellpadding=\\\"4\\\" cellspacing=\\\"0\\\" background=\\\"http://www.0762bc.com/images/middle.gif\\\">
   <tr>
      <td align=\\\"center\\\"><a href=tencent://message/?uin=1002018001;Menu=yes><img border=\\\"0\\\" SRC=\\\"http://www.0762bc.com/images/QQonline.gif\\\">点击交谈</a></td>
   </tr>
   <tr><td align=\\\"center\\\"><a href=tencent://message/?uin=550133280;Menu=yes><img border=\\\"0\\\" SRC=\\\"http://www.0762bc.com/images/QQonline.gif\\\">点击交谈</a></td>
   </tr>
</table></td>

<tr><td colspan=\\\"3\\\"><img height=\\\"50\\\" src=\\\"http://www.0762bc.com/images/qq_logo.gif\\\" width=\\\"110\\\"></td>
</tr>
</table>
</div>
<script type=\\\"text/javascript\\\">
function CloseQQ()
{
divStayTopleft.style.display=\\\"none\\\";
return true;
}
var online= new Array();
lastScrollY=0;
function heartBeat(){
var diffY;
if (document.documentElement ;; document.documentElement.scrollTop)
diffY = document.documentElement.scrollTop;
else if (document.body)
diffY = document.body.scrollTop
else
{/*Netscape stuff*/}

//alert(diffY);
percent=.1*(diffY-lastScrollY);
if(percent>0)percent=Math.ceil(percent);
else percent=Math.floor(percent);
document.getElementById(\\\"divStayTopLeft\\\").style.top=parseInt(document.getElementById(\\\"divStayTopLeft\\\").style.top)+percent+\\\"px\\\";
lastScrollY=lastScrollY+percent;
}
window.setInterval(\\\"heartBeat()\\\",1);
</script>
把QQ替换成你自己的QQ号，若需要增加就把
   <tr><td align=\"center\"><a href=tencent://message/?uin=550133280&Menu=yes><img border=\"0\" SRC=\"http://www.0762bc.com/images/QQonline.gif\">点击交谈</a></td>
   </tr>

复制几行，然后相应地修改两个<table  height=\"60\">数值，增加高度。

里面的图标可以到QQ官网下载：

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

账号		自动登录	找回密码
密码			注册会员

给网站加一个浮动的客户在线助手

本帖子中包含更多资源

浏览过的版块

社区居民

新人进步

忠实会员