<!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=utf-8" />
<title>淡黄色右侧悬浮以及中间弹出在线客服代码</title>
<style>
*{ margin:0; padding:0; list-style:none;}
.lanrenzhijia_r{ width:143px; height:auto; overflow:hidden; position:fixed; right:0; top:100px; z-index:9999;}
.lanrenzhijia_r .top{width:143px; height:69px; background:url(http://demo.lanrenzhijia.com/2014/service1024/images/cslist_top_bg.png) no-repeat;}
.lanrenzhijia_r .main{ width:138px; height:auto; overflow:hidden; background:url(http://demo.lanrenzhijia.com/2014/service1024/images/right_bg.png) repeat-y left top;text-align:left; font-size:12px; padding-left:5px;}
.lanrenzhijia_r .main p{ height:25px; line-height:25px; padding-left:5px;}
.lanrenzhijia_r .bottom{ width:143px; height:17px; background:url(http://demo.lanrenzhijia.com/2014/service1024/images/cslist_btm_bg.png) no-repeat;}
.lanrenzhijia_m{ width:315px; height:145px; background:url(http://demo.lanrenzhijia.com/2014/service1024/images/invite_bg.png) no-repeat; position:fixed; left:50%; top:50%; margin:-72px 0 0 -157px; display:none;}
.lanrenzhijia_m ul .close{ width:25px; height:25px; display:block; position:absolute; right:0; top:0;}
.lanrenzhijia_m ul{width:315px; height:145px; position:relative;}
.lanrenzhijia_m ul a{ display:block; width:70px; height:22px; position:absolute; top:104px;}
</style>
</head>
<body style="height:2000px;">
<!-- 代码部分begin -->
<div class="lanrenzhijia_r">
<div class="top"></div>
<div class="main">
<img src="http://demo.lanrenzhijia.com/2014/service1024/images/kf.gif" style="margin-bottom:10px;" />
<p>在线客服1：13456789</p>
<p>在线客服2：13456789</p>
<p>在线客服3：13456789</p>
<p>在线客服4：13456789</p>
<img src="http://demo.lanrenzhijia.com/2014/service1024/images/zx.gif" style="margin-top:10px;" />
</div>
<div class="bottom"></div>
</div>
<div class="lanrenzhijia_m">
<ul>
<a href="javascript:;" class="close"></a>
<a href="http://www.lanrenzhijia.com/" target="_blank" style="left:145px;"></a>
<a href="http://www.lanrenzhijia.com/js" target="_blank" style="left:235px;"></a>
</ul>
</div>
<script src="http://www.lanrenzhijia.com/ajaxjs/jquery.min.js"></script>
<script>
$(function(){
$('.lanrenzhijia_m').delay(3000).slideDown();
$('.close').click(function(){
$('.lanrenzhijia_m').slideUp();
});
});
</script>
<!-- 代码部分end -->
</body>
</html>
