zoukankan      html  css  js  c++  java
  • 浮动QQ在线客服&网站QQ在线咨询

    浮动QQ在线客服&网站QQ在线咨询

    第一步:先把以下代码保存为kefu.htm

    第二步:按橙色说明修改

    绿色部分是要修改的内容,html文档中不包括说明文字:

    <html>

    <head>

    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">

    <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号后面也必须以半角冒号结束

    以下部分显示第1个客服QQ,注意:online[0]

    <tr><td valign=middle  background=images/kefu_middle.gif>

    <script>

    if (online[0]==0)

    document.write("&nbsp;&nbsp;<img src=images/QQoffline.gif border=0 align=center><a class='qqb' target=blank href='http://wpa.qq.com/msgrd?V=1&Uin=27089965&Site=在线咨询&Menu=no' title='客服不在线,请留言'>售前咨询</a>");

    else

    document.write("&nbsp;&nbsp;<img src=images/QQonline.gif border=0 align=center><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("&nbsp;&nbsp;<img src=images/QQoffline.gif border=0 align=center><a class='qqb' target=blank href='http://wpa.qq.com/msgrd?V=1&Uin=27043921&Site=在线咨询&Menu=no' title='客服不在线,请留言'>技术支持</a>");

    else

    document.write("&nbsp;&nbsp;<img src=images/QQonline.gif border=0 align=center><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("&nbsp;&nbsp;<img src=images/QQoffline.gif border=0 align=center><a class='qqb' target=blank href='http://wpa.qq.com/msgrd?V=1&Uin=240434782&Site=在线咨询&Menu=no' title='客服不在线,请留言'>代理合作</a>");

    else

    document.write("&nbsp;&nbsp;<img src=images/QQonline.gif border=0 align=center><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在线客服”的页面的最后面添加一行:<!--#include file="kefu.htm"-->

     (参考网上代码及腾讯互动服务改编)

  • 相关阅读:
    selenium+java利用AutoIT实现文件上传
    java+selenium自动化遇到confirm弹窗,出现NoAlertPresentException: no alert open
    Appium遇到问题:
    selenium2+java切换窗口
    nodejs
    连续12天的加班工作总结-根据客户选择来生成后续表单页面
    最近三家公司面试的总结吐槽及一点点总结
    nodeJs-autoMerge
    nodeJs-autoBulid
    Angular 学习笔记——ng-Resource1
  • 原文地址:https://www.cnblogs.com/itecho/p/1306063.html
Copyright © 2011-2022 走看看