jQuery点击按钮遮罩弹出在线QQ客服代码



200 797 266



特效描述:jQuery点击按钮 遮罩弹出 在线QQ客服,jQuery弹出遮罩的在线QQ客服代码

代码结构

1. 引入CSS

<link rel="stylesheet" href="css/style.css" type="text/css">

2. 引入JS

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/tipswindown.js"></script>

3. HTML代码

<div style="height:1200px;"></div>
<script type="text/javascript">
/*
*弹出本页指定ID的内容于窗口
*id 指定的元素的id
*title:	window弹出窗的标题
*width:	窗口的宽,height:窗口的高
*/
function showTipsWindown(title,id,width,height){
	tipsWindown(title,"id:"+id,width,height,"true","","true",id);
}
function confirmTerm(s) {
	parent.closeWindown();
	if(s == 1) {
		parent.document.getElementById("isread").checked = true;
	}
}
//弹出层调用
function popTips(){
	showTipsWindown("客服中心", 'simTestContent', 620, 450);
	$("#isread").attr("checked", false);
}
$(document).ready(function(){
	$("#isread").click(popTips);
	$("#isread-text").click(popTips);
});
</script>
<div class="kf_qq_r"><a id="isread-text" href="#"></a></div>
<div style="display:none;">
	<div id="simTestContent" class="simScrollCont">
		<div class="mainlist">
			<div class="kf_qq_li">
				<div class="kf_qq_li_left kf_qq_li_1">
				</div>
				<div class="kf_qq_li_right">
					<div class="kf_r_t">
						<span>企业QQ:</span><a class="qyqq" target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=123456&site=qq&menu=yes">在线咨询</a><span style="padding-left:19px;">400电话:4000-0000-00</span></div>
					<div class="kf_r_d">
						企业QQ与400电话采用集中调度,多人值班,受理所有业务</div>
				</div>
			</div>
			<div class="kf_qq_li">
				<div class="kf_qq_li_left kf_qq_li_2">
				</div>
				<div class="kf_qq_li_right">
					<div class="kf_qq_c">
						<ul>
							<li>
							<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=123456&site=qq&menu=yes">
							售前咨询-峰</a></li>
							<li>
							<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=123456&site=qq&menu=yes">
							售前咨询-汉</a></li>
							<li>
							<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=123456&site=qq&menu=yes">
							售前咨询-玲</a></li>
							<li>
							<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=123456&site=qq&menu=yes">
							售前咨询-量</a></li>
							<li>
							<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=12345633&site=qq&menu=yes">
							售前咨询-霞</a></li>
							<li>
							<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=12345634&site=qq&menu=yes">
							售前咨询-丽</a></li>
							<li>
							<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=12345638&site=qq&menu=yes">
							售前咨询-乔</a></li>
							<li>
							<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=12345632&site=qq&menu=yes">
							售前咨询-娟</a></li>
						</ul>
					</div>
					<div class="kf_r_d">
						业务相关,请咨询售前客服。为避免丢失消息,请尽量添加好友</div>
				</div>
			</div>
			<div class="kf_qq_li">
				<div class="kf_qq_li_left kf_qq_li_3">
				</div>
				<div class="kf_qq_li_right">
					<div class="kf_qq_c">
						<ul>
							<li>
							<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=123456&site=qq&menu=yes">
							售后技术-财</a></li>
							<li>
							<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=123456&site=qq&menu=yes">
							售后技术-海</a></li>
							<li>
							<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=123456&site=qq&menu=yes">
							售后技术-斌</a></li>
							<li>
							<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=1123456&site=qq&menu=yes">
							售后技术-明</a></li>
							<li>
							<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=1123456&site=qq&menu=yes">
							售后技术-军</a></li>
							<li>
							<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=123456&site=qq&menu=yes">
							售后技术-森</a></li>
						</ul>
					</div>
					<div class="kf_r_d">
						售后问题处理,请咨询售后技术。为避免丢失消息,请尽量添加好友</div>
				</div>
			</div>
			<div class="kf_qq_li" style="background:none;">
				<div class="kf_qq_li_left kf_qq_li_4">
				</div>
				<div class="kf_qq_li_right">
					<div class="ke_qq_jl ke_qq_jl_l">
						<div class="jl_left">
							许经理:</div>
						<div class="jl_right">
							<div class="jl_call">
								138-0000-0000</div>
							<div class="jl_qq">
								<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=12345635&site=qq&menu=yes">
								投诉建议</a></div>
						</div>
						<div class="jl_left" style="padding-top:5px;">
							张经理:</div>
						<div class="jl_right" style="padding-top:5px;">
							<div class="jl_call">
								138-0000-0000</div>
						</div>						
					</div>
					<div class="ke_qq_jl">
						<div class="jl_left">
							张经理:</div>
						<div class="jl_right">
							<div class="jl_call">
								138-0000-0000</div>
							<div class="jl_qq">
								<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=123456&site=qq&menu=yes">
								商务合作</a></div>
						</div>
					</div>
					<div style="clear:both">
					</div>					
				</div>
			</div>
		</div>
	</div>
</div>



用户评论
大牛,别默默的看了,快登录帮我点评一下吧!:)      登录 | 注册
admin
关注
TA的相关作品 >>更多
热搜关键词


热门标签: 图片拖动 qq在线客服 右键菜单 图片头像上传 文字拖动 在线客服插件 文字提示框 文件上传 拖动排序 提示框/弹出层 文本框 layer 下拉框 弹出层拖动 lightbox 复选 单选 Tooltip工具提示框 登录框 浮动提示框 注册框 html5弹窗动画 搜索框 验证码 二级联动 三级联动 城市选择 value赋值 筛选 按钮控制 购物车 颜色选择 表单提交 全选/反选 添加删除 添加标签 密码强度验证 表单验证 html5按钮动画 按钮样式 密码修改设置 拖动拽动 弹出层拖动 窗口提示框 切换按钮 在线客服咨询 form表单

×
×

注册

官方QQ群

扫描上面二维码加微信群

官方QQ群

jQuery/js讨论群
群号:642649996
Css3+Html5讨论群
群号:322131262

加群请备注:从官网了解到