jQuery插件-网站右侧栏悬浮在线客服代码-易站站长网

代码介绍：

jQuery网站右侧栏悬浮在线客服代码，鼠标滑过可进行折叠与展开，具体效果请查看演示。

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

演示地址：

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

演示效果图片：

代码如下：

	<!-- 代码开始 www.yizhanzzw.com 易站站长网提供制作 --> 
<div class="container"></div>
<link href="https://www.yizhanzzw.com/yanshi/kefu43/css/style.css" rel="stylesheet" media="screen" type="text/css" />
<script type="text/javascript" src="https://www.yizhanzzw.com/yanshi/kefu43/js/jquery-1.10.2.min.js"></script>
<div style="right:-230px;" class="contactusdiyou">
	<div class="hoverbtn">
		<span>联</span><span>系</span><span>我</span><span>们</span>
		<img class="hoverimg" src="https://www.yizhanzzw.com/yanshi/kefu43/images/hoverbtnbg.gif" height="9" width="13">
	</div>
	<div class="conter">
		<div class="con1"> 
			<dl class="fn_cle">
				<dt><img src="https://www.yizhanzzw.com/yanshi/kefu43/images/tel.png" height="31" width="31"></dt>
				<dd class="f1">咨询热线：</dd>
				<dd class="f2"><span class="ph_num">188-9999-8888</span></dd>
			</dl>
		</div> 
		<div class="blank0"></div>
		<div class="qqcall"> 
			<dl class="fn_cle">
				<dt><img src="https://www.yizhanzzw.com/yanshi/kefu43/images/zxkfqq.png" height="31" width="31"></dt>
				<dd class="f1 f_s14">在线客服：</dd>
				<dd class="f2 kefuQQ">
					<span>客服一</span>
					<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&amp;uin=1111111111&amp;site=qq&amp;menu=yes"></a>
					<span>客服二</span>
					<a target="_blank" href="#"></a>
				</dd>
			</dl>
			<div class="blank0"></div>           
		</div> 
		<div class="blank0"></div>
		<div class="weixincall"> 
			<dl class="fn_cle">
				<dt><img src="https://www.yizhanzzw.com/yanshi/kefu43/images/weixin.png" height="31" width="31"></dt>
				<dd class="f1">官方微信站：</dd>
				<dd class="f3"><img src="https://www.yizhanzzw.com/yanshi/kefu43/images/wechat_code.png" height="73" width="73"></dd>
			</dl>
		</div> 
		<div class="blank0"></div>
		<div class="dytimer">
			<span style="font-weight: bold;">公司官网：</span>
			<span><a href="">www.yizhanzzw.com</a></span>
		</div>
	</div>
</div>

<div class="diyoumask" ></div>

<script type="text/javascript">
$(function() {
	$(".contactusdiyou").hover(function() {
		$(".hoverimg").attr("src","https://www.yizhanzzw.com/yanshi/kefu43/images/hoverbtnbg1.gif");
		$('.diyoumask').fadeIn();
		$('.contactusdiyou').animate({right:'0'},300); 
	}, function() {
		$(".hoverimg").attr("src","https://www.yizhanzzw.com/yanshi/kefu43/images/hoverbtnbg.gif");
		$('.contactusdiyou').animate({right:'-230px'},300,function(){});
		$('.diyoumask').fadeOut();
	});
});
</script>

			<!-- 代码结束 www.yizhanzzw.com 易站站长网提供制作 -->