网站商务通高级定制教程(1)

模板网 2014-09-10

网站商务通高级定制教程(1),今天为大家介绍一下商务通的高级定制方面的知识,利用到了之前和大家说过的 商务通核心函数库解密格式化后的代码 中的一个函数。

实现功能:

邀请框二次弹出、自定义快速邀请框内容、邀请后浏览器标题显示新信息闪烁和一个使最小化的浏览器显示出来并在屏幕最上层(目前只在IE和Google内核浏览器上有效果)。

核心代码介绍:

实现商务通快速邀请框自定义的实现方法是,覆盖了商务通自带的弹出邀请框函数LR_showInviteDiv(),函数原型如下:

复制代码 代码如下:

function LR_showInviteDiv(h1, h2){}

函数包含两个参数,本实例中未做实现,主要功能是通过传递的参数实现显示自定义的邀请语。在以后的教程中再为大家介绍。

还有一个需要注意的是,大家在自定义快速邀请框的时候,关闭邀请框时一定要调用一下商务通自带的函数LR_RefuseChat(),该函数的功能是向商务通服务器发送访客拒绝对话的信号,让商务通软件将访客从邀请列表中移动到在线列表,不调用这个函数会导致当访客关闭邀请框时,商务通软件中访客还是在邀请列表中。

其他的方面这里就不做介绍了,代码中都做了详细的介绍,相信具有一定JS基础的朋友们一看就能明白的。

效果图:

网站商务通高级定制教程(1) | 医疗模板库www.120muban.com

网站商务通高级定制教程(1) | 医疗模板库www.120muban.com

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
  5. <title>网站商务通高级定制教程(1) | 医疗模板库www.120muban.com</title>
  6. <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
  7. <!--标题显示新信息闪烁-->
  8. <script type="text/javascript">
  9. var title=document.title,flag=true,Timer1=null;
  10. function NewMsg(){
  11. document.title="【新信息】"+title;
  12. Timer1=setInterval(function(){
  13. if(flag){
  14. document.title="【新信息】"+title;
  15. }else{
  16. document.title="【   】"+title;
  17. }
  18. flag=!flag;
  19. },1000);
  20. }
  21. function stopNewMsg(){
  22. window.clearInterval(Timer1);
  23. document.title=title;
  24. }
  25. </script>
  26. <!--标题显示新信息闪烁-->
  27. </head>
  28. <body>
  29. <p>网站商务通高级定制教程(1) | 医疗模板库www.120muban.com</p>
  30. <!--引入商务通JS代码 测试请替换为自己的-->
  31. <script type="text/javascript" src="http://kft.zoosnet.net/JS/LsJS.aspx?siteid=KFT41832211&float=0&lng=cn"></script>
  32. <!--引入商务通JS代码 测试请替换为自己的-->
  33. <!--普通弹出框-->
  34. <script type="text/javascript">
  35. var showEnable=true;
  36. function hideSwtBox(){
  37. $("#swtBox").hide();
  38. if(showEnable){showSwtBox();}
  39. }
  40. function showSwtBox(){
  41. setTimeout(function(){$("#swtBox").show();},5000);
  42. }
  43. //普通弹出框代码,这里为了演示只做了简单布局,大家可以根据自己的需求自由发挥。
  44. $("body").append('<div id="swtBox" style="margin-top:-120px;margin-left:-170px;width:340px;height:240px;position:fixed;top:50%;left:50%;background:#99CC66;border-radius:5px;_position: absolute;_top: expression(eval(document.documentElement.clientHeight/2+document.documentElement.scrollTop));_left: expression(eval(document.documentElement.clientWidth/2+document.documentElement.scrollLeft));"><h1 style="width:280px;margin:5px;padding:0;font-size:16px;color:#333;font-family:\'Microsoft Yahei\';display:inline-block;">在线专家请求与您对话</h1><a href="javascript:void(0);" onclick="hideSwtBox();" style="color:#CC3333;text-decoration:none;">关闭</a><div style="width:340px;height:200px;line-height:200px;text-align:center;"><a href="javascript:void(0);" onclick="openZoosUrl();hideSwtBox();showEnable=false;">接受邀请</a>&#160;&#160;&#160;&#160;<a href="javascript:void(0);" onclick="hideSwtBox();">下次再说</a></div></div>');
  45. </script>
  46. <!--普通弹出框-->
  47. <!--邀请弹出框-->
  48. <script type="text/javascript">
  49. function hideInvite(){
  50. $("#inviteBox").hide();
  51. }
  52. //覆盖商务通函数
  53. function LR_showInviteDiv(h1, h2){
  54. NewMsg();//标题显示新信息闪烁
  55. showEnable=false;hideSwtBox();
  56. $("#inviteBox").remove();
  57. //邀请弹出框代码,这里为了演示只做了简单布局,大家可以根据自己的需求自由发挥。
  58. $("body").append('<div id="inviteBox" style="margin-top:-120px;margin-left:-170px;width:340px;height:240px;position:fixed;top:50%;left:50%;background:#FF6666;border-radius:5px;_position: absolute;_top: expression(eval(document.documentElement.clientHeight/2+document.documentElement.scrollTop));_left: expression(eval(document.documentElement.clientWidth/2+document.documentElement.scrollLeft));"><h1 style="width:280px;margin:5px;padding:0;font-size:16px;color:#333;font-family:\'Microsoft Yahei\';display:inline-block;">在线专家请求与您对话</h1><a href="javascript:void(0);" onclick="hideInvite();LR_RefuseChat();stopNewMsg();showEnable=true;showSwtBox();" style="color:#EEEEEE;text-decoration:none;">关闭</a><div style="width:340px;height:200px;line-height:200px;text-align:center;"><a href="javascript:void(0);" onclick="openZoosUrl();hideInvite();">接受邀请</a>&#160;&#160;&#160;&#160;<a href="javascript:void(0);" onclick="hideInvite();stopNewMsg();LR_RefuseChat();showEnable=true;showSwtBox();">下次再说</a></div></div>');
  59. window.focus();//是窗口获得焦点,IE浏览器有效,IE浏览器最小化时这句代码会使浏览器窗口显示并展现在屏幕最上层。
  60. setTimeout("alert('在线专家请求与您对话!');",3000);//弹出对话框,不需要可去除,实现功能:当浏览器是Google浏览器的时候这句代码会使浏览器窗口显示并展现在屏幕最上层。
  61. }
  62. </script>
  63. <!--邀请弹出框-->
  64. </body>
  65. </html>

相关文章

  1. 百度离线宝调用接口

    医疗模板库(www.120muban.com)收集整理的百度离线宝调用接口,使用方便,可自定义离线宝样式。 //data-lxb-uid 为百度推广账户ID //data-lxb-gid 为离线宝分组ID,没有可留空。

  2. 在商务通对话窗口中添加离线宝的方法

    将以下代码通过商务通后台添加到商务通对话窗口中即可实现将离线宝加入商务通对话窗口。 需要将 input id=uid value= 6026803 type=hidden name=uid 中的 6026803 替换为自己的开通了离线宝的百度推广账户ID 复制代码 代码如下: p form id=lxb-data-form inp

  3. 网站商务通高级定制教程(1)

    网站商务通高级定制教程(1),今天为大家介绍一下商务通的高级定制方面的知识,利用到了之前和大家说过的 商务通核心函数库解密格式化后的代码 中的一个函数。 实现功能: 邀请框二次弹出、自定义快速邀请框内容、邀请后浏览器标题显示新信息闪烁和一个使最小

  4. 商务通轨迹代码未加载出来前执行的打开商通对话的函数

    医疗网站上的商务通代码在一些情况下可能出现无法加载的情况(常见的有网络速度慢,商务通服务器速度慢,商务通服务器受到攻击等),导致商务通代码无法执行,访客无法进入商务通进行咨询,这样错失了很多的对话机会,给我们造成很大的损失。 下面医疗模板库为

  5. 离线宝高级定制API使用示例

    离线宝高级定制操作说明 自定义API使用示例下载 一.搬 1.1 搬图 将解压后的images文件夹,放在您网站要显示浮窗页面的同级目录下。 1.2 搬代码 1.2.1 浮窗样式。打开解压后的index.html文件,将浮窗样式开始-浮窗样式结束之间的代码添加至您网站要显示浮窗的

随机推荐

  1. 百度离线宝调用接口

    医疗模板库(www.120muban.com)收集整理的百度离线宝调用接口,使用方便,可自定义离线宝样式。 //data-lxb-uid 为百度推广账户ID //data-lxb-gid 为离线宝分组ID,没有可留空。

  2. 在商务通对话窗口中添加离线宝的方法

    将以下代码通过商务通后台添加到商务通对话窗口中即可实现将离线宝加入商务通对话窗口。 需要将 input id=uid value= 6026803 type=hidden name=uid 中的 6026803 替换为自己的开通了离线宝的百度推广账户ID 复制代码 代码如下: p form id=lxb-data-form inp

  3. 网站商务通高级定制教程(1)

    网站商务通高级定制教程(1),今天为大家介绍一下商务通的高级定制方面的知识,利用到了之前和大家说过的 商务通核心函数库解密格式化后的代码 中的一个函数。 实现功能: 邀请框二次弹出、自定义快速邀请框内容、邀请后浏览器标题显示新信息闪烁和一个使最小

  4. 商务通轨迹代码未加载出来前执行的打开商通对话的函数

    医疗网站上的商务通代码在一些情况下可能出现无法加载的情况(常见的有网络速度慢,商务通服务器速度慢,商务通服务器受到攻击等),导致商务通代码无法执行,访客无法进入商务通进行咨询,这样错失了很多的对话机会,给我们造成很大的损失。 下面医疗模板库为

  5. 离线宝高级定制API使用示例

    离线宝高级定制操作说明 自定义API使用示例下载 一.搬 1.1 搬图 将解压后的images文件夹,放在您网站要显示浮窗页面的同级目录下。 1.2 搬代码 1.2.1 浮窗样式。打开解压后的index.html文件,将浮窗样式开始-浮窗样式结束之间的代码添加至您网站要显示浮窗的