1 <!--qq客服--> 2 <div class="box_os"> 3   <div class="os_x" style=""></div> 4     <div class="osqq"> 5     <p><em>(工作日：9:30-18:30)</em></p> 6    <!-- 7     <a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=2692594761&site=qq&menu=yes"><img border="0" src="http://wpa.qq.com/pa?p=2:2692594761:51" alt="欢迎欢迎热烈欢迎" title="欢迎欢迎热烈欢迎"/></a> 8    --> 9       <a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=2692594761&site=qq&menu=yes"><p id="ico_onlineqq" class="qq"></p></a>10       <p><strong>微博</strong><span><a href="http://weibo.com/" target="_blank">微博账户名</a></span></p>11      12     </div>13     <div class="acbox">14       <a class="ico_pp" href="javascript:void(0);" title=""></a>15         <a class="ico_gt" href="javascript:" target="_self" title=""></a>16         <div style="display: none;" ><img src="static/images/two-dimension.jpg" style="width:120px;height:120px"></div>17     </div>18 </div>19 <div class="onlineService">20   <p class="ico_os"></p>21     <a class="ico_pp"  href="#" title=""></a>22      <div style="display: none;margin-left:-120px;margin-top:-12px;" ><img src="static/images/two-dimension.jpg" style="width:120px;height:120px"></div>23     <a class="ico_gt" href="javascript:" target="_self" title=""></a>24    25 </div>

1 <!--在线客服的css-->2    <script src="js/service.js" type="text/javascript"></script>3    <link href="static/css/lanrenzhijia.css" rel="stylesheet" type="text/css" />

  1 $(function(){  2       3     var _userAgent = window.navigator.userAgent.toLowerCase();  4     if(_userAgent.indexOf(‘android‘)<0 && _userAgent.indexOf(‘iphone‘)<0 &&  _userAgent.indexOf(‘ipad‘)<0 )  5     {   6       7     if($.cookie("onlineSP")==null||$.cookie("onlineSP")=="0"||$.cookie("onlineSP")=="")  8         {  9             $(‘.onlineService‘).show(); 10             $(‘.box_os‘).hide();         11         } 12         else if($.cookie("onlineSP")=="1") 13         { 14             $(‘.onlineService‘).hide(); 15             $(‘.box_os‘).show();         16         } 17      18     } 19     else{ 20         $(‘.onlineService‘).show(); 21         $(‘.box_os‘).show(); 22          23     } 24      25     $(‘.onlineService .ico_os‘).click(function() 26     {         27         $(‘.onlineService‘).hide(); 28         $(‘.box_os‘).show(); 29         $.cookie("onlineSP","0",{expires:1,path:"/",domain:"lanrenzhijia.com"});         30     }); 31     $(‘.os_x‘).click(function() 32     { 33         $(‘.box_os‘).hide(); 34         $(‘.onlineService‘).show(); 35         $.cookie("onlineSP","1",{expires:2100000000,path:"/",domain:"lanrenzhijia.com"}); 36     }); 37     $boxOsFun = function(){var st=$(document).scrollTop();if (!window.XMLHttpRequest) {$(‘.box_os‘).css(‘top‘,st+44);$(‘.onlineService‘).css(‘top‘,st+44);}}; 38     $(window).bind(‘scroll‘, $boxOsFun); 39     $boxOsFun(); 40      41     var feedback_url =‘http://www.lanrenzhijia.com‘; 42      43     $(‘.acbox .ico_pp‘).hover(function(){ 44         $(this).stop().animate({height:‘52px‘},‘fast‘); 45         },function(){ 46         $(this).stop().animate({height:‘33px‘},‘fast‘); 47         } 48     ); 49     $(‘.acbox .ico_gt‘).hover(function(){ 50         $(this).stop().animate({height:‘52px‘},‘fast‘); 51         },function(){ 52         $(this).stop().animate({height:‘33px‘},‘fast‘); 53         } 54     ); 55      56     $(‘.onlineService .ico_pp‘).hover(function(){ 57         $(this).stop().animate({width:‘87px‘},‘fast‘); 58         },function(){ 59         $(this).stop().animate({width:‘39px‘},‘fast‘); 60         } 61     ); 62     $(‘.onlineService .ico_gt‘).hover(function(){ 63         $(this).stop().animate({width:‘97px‘},‘fast‘); 64         },function(){ 65         $(this).stop().animate({width:‘39px‘},‘fast‘); 66         } 67     ); 68      69     $(‘.ico_gt‘).click(function(){ 70         $("html, body").animate({scrollTop:0}, 1); 71     }) 72      73      74     //分辨率 75     if ( $(window).width()<1200 || screen.width<1200)  76     {  77         $(‘.hydp950,.w_950,.sdmain,.main‘).css(‘overflow‘,‘hidden‘); 78         $(‘.top_bg‘).css({‘overflow‘:‘hidden‘,‘width‘:‘950px‘,‘margin‘:‘0 auto‘}); 79         $(‘.db_bg2‘).addClass(‘db_bg2_s‘); 80         $(‘.jstd_c .bg_l,.jstd_c .bg_r‘).css(‘display‘,‘none‘); 81         $(‘#js_play .prev‘).css(‘left‘,‘0‘); 82         $(‘#js_play .next‘).css(‘right‘,‘0‘); 83         $(‘#videoplay .prev, #videoplay2 .prev‘).addClass(‘prev_s‘); 84         $(‘#videoplay .next, #videoplay2 .next‘).addClass(‘next_s‘); 85     }else{ 86         $(‘.hydp950,.w_950,.sdmain,.main‘).removeAttr(‘style‘); 87         $(‘.top_bg‘).removeAttr(‘style‘); 88         $(‘.db_bg2‘).removeClass(‘db_bg2_s‘); 89         $(‘.jstd_c .bg_l,.jstd_c .bg_r‘).removeAttr(‘style‘); 90         $(‘#js_play .prev‘).removeAttr(‘style‘); 91         $(‘#js_play .next‘).removeAttr(‘style‘); 92         $(‘#videoplay .prev, #videoplay2 .prev‘).removeClass(‘prev_s‘); 93         $(‘#videoplay .next, #videoplay2 .next‘).removeClass(‘next_s‘); 94     } 95     $(".ico_pp").hover(function(){ 96     $(".ico_pp").siblings("div").fadeIn(0); 97     },function(){ 98         $(".ico_pp").siblings("div").fadeOut(0); 99     });100 101 });

 1 @charset "utf-8"; 2 /* 代码整理：懒人之家 www.lanrenzhijia.com */ 3 *{ margin:0; padding:0; list-style:none;} 4 img{ border:0;} 5  6  7 /*-- 本例样式 --*/ 8 .box_os .os_x, .box_os .osqq, .ico_os, .ico_gt, .ico_pp, .osqq .qq{ background:url(../images/kf.png) no-repeat;} 9 .box_os{ height:auto; overflow:hidden; width:131px; position:fixed; right:0; top:44px; _position:absolute; z-index:9999;display:none;}10 .box_os .os_x{ background-color:#f7f7f7; background-position:2px 2px; width:18px; height:20px; float:right; display:inline; cursor:pointer; margin-top: 30px;}11 .box_os .osqq{ width:129px; border:1px solid #D1D1D1; background-color:#fff; background-position:0 -120px; clear:both; padding:37px 0 8px 0; text-align:center;}12 .box_os .osqq p{ height:auto; line-height:20px;width:129px; margin-top:8px;}13 .box_os .osqq p strong{ color:#666;}14 .box_os .osqq img{ padding:7px 0 3px 0;}15 .box_os .osqq p em{ color:#999; display:block;}16 .box_os .osqq p span{ color:#547816; display:block;}17 .box_os .osqq .qq{ background-position:-140px -120px; display:block; width:99px; height:26px; margin:0 auto; margin-top:8px; cursor:pointer;}18 .acbox{ width:130px; overflow:hidden;}19 .acbox .ico_gt{ background-position:-60px 0; border:1px solid #299ec0; border-top:0; cursor:pointer; width:60px; height:33px; float:right;}20 .acbox .ico_pp{ background-position:-60px -60px;border-top:0; cursor:pointer; width:60px; height:33px; float:right; margin:0 2px;}21 .onlineService{ background:none; display:none; width:39px; *width:84px; height:178px; ;position:fixed; right:0; top:84px; _position:absolute;}22 .onlineService .ico_os{ background-position:-2px -20px; border:1px solid #c7c7c7; cursor:pointer; width:39px; height:98px; float:right;}23 .onlineService .ico_gt{ background-position:right 0; border:1px solid #299ec0; cursor:pointer; width:39px; height:37px; float:right; clear:both;}24 .onlineService .ico_pp{ background-position:right -60px; cursor:pointer; width:40px; height:37px; float:right; margin:0 0 1px 0; clear:both;}25 .box_os .osqq p span a{color:#557917;}26 /* 代码整理：懒人之家 www.lanrenzhijia.com */