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

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

实现功能：

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

核心代码介绍：

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

function LR_showInviteDiv(h1, h2){}

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

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

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

效果图：

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

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>网站商务通高级定制教程(1) | 医疗模板库www.120muban.com</title>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<!--标题显示新信息闪烁-->
<script type="text/javascript">
	var title=document.title,flag=true,Timer1=null;
	function NewMsg(){
		document.title="【新信息】"+title;
		Timer1=setInterval(function(){
					if(flag){
						document.title="【新信息】"+title;
					}else{
						document.title="【　　　】"+title;
					}
					flag=!flag;
				},1000);
	}
	function stopNewMsg(){
		window.clearInterval(Timer1);
		document.title=title;
	}
</script>
<!--标题显示新信息闪烁-->
</head>
<body>

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

<!--引入商务通JS代码 测试请替换为自己的-->
<script type="text/javascript" src="http://kft.zoosnet.net/JS/LsJS.aspx?siteid=KFT41832211&float=0&lng=cn"></script>
<!--引入商务通JS代码 测试请替换为自己的-->

<!--普通弹出框-->
<script type="text/javascript">
var showEnable=true;
function hideSwtBox(){
	$("#swtBox").hide();
	if(showEnable){showSwtBox();}
}
function showSwtBox(){	
	setTimeout(function(){$("#swtBox").show();},5000);
}
//普通弹出框代码，这里为了演示只做了简单布局，大家可以根据自己的需求自由发挥。
	$("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>');
</script>
<!--普通弹出框-->



<!--邀请弹出框-->
<script type="text/javascript">
function hideInvite(){
	$("#inviteBox").hide();
}
//覆盖商务通函数
function LR_showInviteDiv(h1, h2){
	NewMsg();//标题显示新信息闪烁
	showEnable=false;hideSwtBox();
	$("#inviteBox").remove();

	//邀请弹出框代码，这里为了演示只做了简单布局，大家可以根据自己的需求自由发挥。
	$("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>');	
	window.focus();//是窗口获得焦点，IE浏览器有效，IE浏览器最小化时这句代码会使浏览器窗口显示并展现在屏幕最上层。
	setTimeout("alert('在线专家请求与您对话!');",3000);//弹出对话框，不需要可去除，实现功能：当浏览器是Google浏览器的时候这句代码会使浏览器窗口显示并展现在屏幕最上层。
}
</script>
<!--邀请弹出框-->

</body>
</html>

随机推荐

自定义商务通二次弹出原理
自定义商务通二次弹出原理，商务通窗口被关闭后，指定时间后再次弹出。演示代码仅使用纯色作为弹出窗背景，实际运用中可替换为图片。核心代码: 复制代码代码如下: script function hideSwt(){ document.getElementById(swtBox).style.display=none;//隐藏
在商务通对话窗口中添加离线宝的方法
将以下代码通过商务通后台添加到商务通对话窗口中即可实现将离线宝加入商务通对话窗口。需要将 input id=uid value= 6026803 type=hidden name=uid 中的 6026803 替换为自己的开通了离线宝的百度推广账户ID 复制代码代码如下: p form id=lxb-data-form inp
很好看的手机站底部
很好看的手机站底部，每个按钮宽度都是自适应的，适合不同屏幕分辨率的手机。代码整理格式化，去除无用代码，方便使用与修改。效果截图: 打包下载: 很好看的手机站底部
表单提交到商务通后台中文说明加换行的实现方法
实现将表单中的数据提交到商务通后台的效果，中文说明并且实现换行显示。代码简单容易理解，这里就不多解释了。要点：1、使用escape函数对中文进行编码；2、使用br标签进行换行。效果如下图：前台界面提交到商务通后台的结果提交到商务通后台的结果
很炫的商务通效果
很炫的商务通效果在线演示：很炫的商务通效果下载：很炫的商务通效果效果截图：

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

相关文章

随机推荐