网站右侧win8风格在线客服代码-易站站长网

代码介绍：

网站右侧win8风格在线客服代码，点击可进行折叠与展开，具体效果请查看演示。

把代码中必要的数字/文字/图片信息修改为自己的信息，即可投入到自己的网站使用。

演示地址：

https://www.yizhanzzw.com/yanshi/kefu55

演示效果图片：

代码如下：

	<!-- 代码开始 www.yizhanzzw.com 易站站长网提供制作 --> 
			<link rel="stylesheet" href="https://www.yizhanzzw.com/yanshi/kefu55/css/style.css">
	<div id="lanren">
		<div class="kfleft" title="点击查看联系方式"></div>
		<ul>
			<li><a rel="nofollow" href="http://wpa.qq.com/msgrd?v=3&uin=123456789&site=qq&menu=yes" title="销售咨询" target="_blank"></a></li>
			<li><a rel="nofollow" href="http://wpa.qq.com/msgrd?v=3&uin=123456789&site=qq&menu=yes" title="美工咨询" target="_blank"></a></li>
			<li><a rel="nofollow" href="http://wpa.qq.com/msgrd?v=3&uin=123456789&site=qq&menu=yes" title="技术咨询" target="_blank"></a></li>
			<li><a rel="nofollow" href="http://wpa.qq.com/msgrd?v=3&uin=123456789&site=qq&menu=yes" title="优化咨询" target="_blank"></a></li>
			<li><a rel="nofollow" href="http://wpa.qq.com/msgrd?v=3&uin=123456789&site=qq&menu=yes" title="售后咨询" target="_blank"></a></li>
			<li><a rel="nofollow" href="http://wpa.qq.com/msgrd?v=3&uin=123456789&site=qq&menu=yes" title="财务咨询" target="_blank"></a></li>
			<li><a href="http://www.yizhanzzw.com/" title="联系方式" target="_blank"></a></li>
		</ul>
	</div>
	<script src="https://www.yizhanzzw.com/yanshi/kefu55/js/jQuery.js"></script>
	<script>
		$(function(){
			$(".kfleft").on("click",function(){
				var target = $("#lanren");
				var distance = target.css("right");
				if (distance == '0px'){
					target.animate({right:-80}, 200);
				} else {
					target.animate({right:0}, 200);
				}
			});
		})
	</script>
	<!-- 代码结束 www.yizhanzzw.com 易站站长网提供制作 -->