1、新建html文档。
3、书写hmtl代码。<div style="height:1200px;"></div><div class="box_os"> <div class="os_x"></div> <div class="osqq"> <p><em>(工作日：9:30-18:30)</em></p> <p><strong>在线QQ</strong></p> <a target="_blank" href="#"><p id="ico_onlineqq" class="qq"></p></a> <p><strong>客服电话</strong><span>00000000000</span><span>00000000000</span></p> <p><strong>会员卡代理</strong><span>000000000-0000</span></p> <p><strong>微博</strong><span><a href="#" target="_blank">微博账户名</a></span></p> </div> <div class="acbox"> <a class="ico_pp" onclick="FeedbackUtil.feed('#');" href="#"></a> <a class="ico_gt" href="#" target="_self"></a> </div></div><div class="onlineService"> <p class="ico_os"></p> <a class="ico_pp" onclick="FeedbackUtil.feed('#');" href="#"></a> <a class="ico_gt" href="#" target="_self"></a></div>
5、书写并添加js代码。$(function(){ var _userAgent = window.navigator.userAgent.toLowerCase(); 足毂忍珩if(_userAgent.indexOf('android')<0 && _userAgent.indexOf('iphone')<0 && _userAgent.indexOf('ipad')<0 ) { if($.cookie("onlineSP")==null||$.cookie("onlineSP")=="0"||$.cookie("onlineSP")=="") { $('.onlineService').show(); $('.box_os').hide(); } else if($.cookie("onlineSP")=="1") { $('.onlineService').hide(); $('.box_os').show(); } } else{ $('.onlineService').show(); $('.box_os').show(); } $('.onlineService .ico_os').click(function() { $('.onlineService').hide(); $('.box_os').show(); $.cookie("onlineSP","0",{expires:1,path:"/",domain:"lanrenzhijia.com"}); }); $('.os_x').click(function() { $('.box_os').hide(); $('.onlineService').show(); $.cookie("onlineSP","1",{expires:2100000000,path:"/",domain:"lanrenzhijia.com"}); }); $boxOsFun = function(){var st=$(document).scrollTop();if (!window.XMLHttpRequest) {$('.box_os').css('top',st+44);$('.onlineService').css('top',st+44);}}; $(window).bind('scroll', $boxOsFun); $boxOsFun(); var feedback_url ='http://www.lanrenzhijia.com'; $('.acbox .ico_pp').hover(function(){ $(this).stop().animate({height:'52px'},'fast'); },function(){ $(this).stop().animate({height:'33px'},'fast'); } ); $('.acbox .ico_gt').hover(function(){ $(this).stop().animate({height:'52px'},'fast'); },function(){ $(this).stop().animate({height:'33px'},'fast'); } ); $('.onlineService .ico_pp').hover(function(){ $(this).stop().animate({width:'87px'},'fast'); },function(){ $(this).stop().animate({width:'39px'},'fast'); } ); $('.onlineService .ico_gt').hover(function(){ $(this).stop().animate({width:'97px'},'fast'); },function(){ $(this).stop().animate({width:'39px'},'fast'); } ); $('.ico_gt').click(function(){ $("html, body").animate({scrollTop:0}, 1); }) //分辨率 if ( $(window).width()<1200 || screen.width<1200) { $('.hydp950,.w_950,.sdmain,.main').css('overflow','hidden'); $('.top_bg').css({'overflow':'hidden','width':'950px','margin':'0 auto'}); $('.db_bg2').addClass('db_bg2_s'); $('.jstd_c .bg_l,.jstd_c .bg_r').css('display','none'); $('#js_play .prev').css('left','0'); $('#js_play .next').css('right','0'); $('#videoplay .prev, #videoplay2 .prev').addClass('prev_s'); $('#videoplay .next, #videoplay2 .next').addClass('next_s'); }else{ $('.hydp950,.w_950,.sdmain,.main').removeAttr('style'); $('.top_bg').removeAttr('style'); $('.db_bg2').removeClass('db_bg2_s'); $('.jstd_c .bg_l,.jstd_c .bg_r').removeAttr('style'); $('#js_play .prev').removeAttr('style'); $('#js_play .next').removeAttr('style'); $('#videoplay .prev, #videoplay2 .prev').removeClass('prev_s'); $('#videoplay .next, #videoplay2 .next').removeClass('next_s'); }});
7、查看效果。
