HTML 给网站右侧加悬浮在线客服的方法

图例

20240105191038508-图片

总代码

<div class="kf" style="right: 20px;" >
    <div class="kt-top" style="background-color:#35c5a3">在线客服 <span class="close"> <b></b> <b></b> </span> </div>
    <div class="con">
        <ul class="qq">
            <li>
                <a class="IM-item-link IM-qq" style="height:25px;" target="_blank" href="http://wpa.qq.com/msgrd?v=3&amp;uin=1810216796&amp;site=qq&amp;menu=yes"> <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAVCAYAAABLy77vAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjRBMDI1MUI2MDZGOTExRThBNzcwQjRCNDE2QTYyRUM1IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjRBMDI1MUI3MDZGOTExRThBNzcwQjRCNDE2QTYyRUM1Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NEEwMjUxQjQwNkY5MTFFOEE3NzBCNEI0MTZBNjJFQzUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NEEwMjUxQjUwNkY5MTFFOEE3NzBCNEI0MTZBNjJFQzUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6Mk91KAAADQklEQVR42nxUa0hUQRT+7t2Hpa675rpabim9jB6WGNaK2ss2s6cEmUr0JwQrhbI//QiiIDGKqAiMHiBBD8rEsjCFSCLTIqOHqKWg6Ja5Ue2uz+u605mru626euDjnDkz8815zIwAH7LGvCucVD5hG2ERQSC0EZ4RLtZXlf+YuEfwQbKP1HVCIHzLICGHyG57OxUTSDJI3SOoMbUoCenGBUvaLG0tn9xO0YskdCwSWY7lHsTNS+cQbghFsE6L4gtncbIgH4LgSaKY9syeRESSS9BwY55xDvbu3o73Hz9jz4407NiSgt6+fqRt3oCl0Yvc6wMIeb6I0v4XbvTUoSEJCoUIURSRuGa1HA23vSTVO1+3RLqNji4Lyp4+x/pEE06cKcKQJCE5IR5dlm58aWrxJpo7qWuU719SWlFkSFz8B8sieqHXSNDMcMrzjkElrHY1mr4H4vW3YDhH5K026p7OExEzxRyvG+gOuKPSolmjQuba74iNsvtsWTMRNVoCYfjLkC3Z/DeZYq4Kbz4dlmldpph6MuK5bRFVqFH6o0srInDuEGbqhiluAQN2BXo7/RDyG1jn7MdCl+TmthKRQY6o2C+4P1OyQ8dGEOEaRpZko2mMYpwMjB/RARUqTYdcI6pNLOkGPzDccDQj0sWgFmdiOnHM0qPCT4tbDiccgtxFE4/okNxqqnufWo2eP61wUWT6lWb4J1F3bdSDERcQpKW+RgErY6ExzkPr+ctwVL9wcx/mRCmeu6DQwRiwGMM8f/NOYH/OlFH19Y9LcyMnCvMMh0cLqBLpqc0Kmza99s5O7+FsTsQ9/FtQVysCTOHR0dDrQ4AVq6Yk6e6xoqPTws23BH5P5ivHrjn3pt1XB5U1B0XgWmHhtNHcKS0HY4ybRYQn/Hl6JlltqCoj21xHXWR3Hz1mUwk9ZGZKTWd7s8zv+J5Jp5DzwUBNGCvIS5IXltx7yJxO5ziS6pev2Kb0TFZwJJnxtbSndNJbI2ctvw884vKGMJS8MkISwhG3ajlUShUaW75i0N6GA4ld2B33E2PfUoOQYI2bSDSH1KmxmhmI0PqhQ1t3pSqy0ukS2NHU9q2xkbZ4IjDQ/C9CJeE0Ecnt+yfAAGYIRgwuAi9IAAAAAElFTkSuQmCC" alt="点击这里给我发消息" onerror="$(this).hide();" border="0" align="absmiddle"> 客服</a>
            </li>

        </ul>
        <h5>联系方式</h5>
        <div class="contact">
            <p>热线电话</p>
            <p><a href='tel:1008611' style="text-decoration: none;color: #35c5a3;font-weight: bold;">1008611 点击拨打</a></p>
            <p>上班时间</p>
            <p>周一到周五</p>
        </div>
        <h5 class="qr-icon">二维码</h5>
        <div class="qr"><img src="/skin/static/picture/wx.jpg"> </div>
    </div>
    <div class="kf-side" style="background-color:#35c5a3"> <b>在</b><b>线</b><b>客</b><b>服</b> <span class="arrow on"></span> </div>
    <a  href="#topAnchor"><div class="backTop" style="background-color:#35c5a3"></div></a>
</div>
<style>
.img-center {text-align: center;font-size: 0;}
.img-center img {display: inline-block;width: auto;height: auto;max-width: 100%;max-height: 100%;vertical-align: middle;-webkit-transition: all 0.5s;transition: all 0.5s;}

.img-cover {overflow: hidden;position: relative;}
.img-cover span {display: block;width: 100%;background: no-repeat center / cover;-webkit-transition: all 0.5s;transition: all 0.5s;height: 100%;position: absolute;left: 0;top: 0;}

.container {padding: 0 15px;width: 1200px;margin: 0 auto;}

.kf{width:208px;position:fixed;/* right: 20px; */right:-208px;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);z-index:10;}
.kt-top{height:40px;line-height:40px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAAAACXBIWXMAAAsTAAALEwEAmpwYAAAFEmlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDIgNzkuMTYwOTI0LCAyMDE3LzA3LzEzLTAxOjA2OjM5ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgKFdpbmRvd3MpIiB4bXA6Q3JlYXRlRGF0ZT0iMjAxOS0wNi0xMVQxMDoxMjowOCswODowMCIgeG1wOk1vZGlmeURhdGU9IjIwMTktMDYtMTFUMTA6MTI6NDYrMDg6MDAiIHhtcDpNZXRhZGF0YURhdGU9IjIwMTktMDYtMTFUMTA6MTI6NDYrMDg6MDAiIGRjOmZvcm1hdD0iaW1hZ2UvcG5nIiBwaG90b3Nob3A6Q29sb3JNb2RlPSIzIiBwaG90b3Nob3A6SUNDUHJvZmlsZT0ic1JHQiBJRUM2MTk2Ni0yLjEiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6Y2M1NDYwZmMtNTAxMS00ZDRm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) 12px center no-repeat #e62022;-ms-background-size:auto 20px;background-size:auto 20px;padding-left:46px;font-size:14px;color:#fff;}
.kt-top span:hover{-webkit-transform:rotate(90deg);transform:rotate(90deg);}
.kt-top span{width:18px;height:16px;float:right;position:relative;margin:10px 10px 0 0;cursor:pointer;transition:.5s;-webkit-transition:.5s;-moz-transition:.5s;-ms-transition:.5s;-o-transition:.5s;}
.kt-top span b{width:100%;height:2px;background:#fff;display:block;position:absolute;top:50%;left:0;}
.kt-top span b:first-child{transform:rotate(45deg);-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);}
.kt-top span b:last-child{transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);}
.kf .con{overflow:hidden;background:#fff;}
.kf .qq li{height:36px;line-height:36px;border-bottom:#f5f5f5 solid 1px;padding-left:16px;}
.kf .qq li a{height:36px!important;color:#666;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-decoration:initial;display:block;}
.kf .qq li a img{padding-right:6px;}
.kf .con h5{height:26px;line-height:26px;margin-top:12px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDoyZTE5N2VlOC04Njk5LWU0NDUtOGMxNi02NmRjODAxZTZlNzgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OTVDRkMyOTI5MDZEMTFFNkE2N0E5OEY2ODE3RkY3N0EiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OTVDRkMyOTE5MDZEMTFFNkE2N0E5OEY2ODE3RkY3N0EiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6YzMwYzA3MjItMmJhOC1hZjQyLThjMjUtZTdmYjM0OTA1NmFkIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjJlMTk3ZWU4LTg2OTktZTQ0NS04YzE2LTY2ZGM4MDFlNmU3OCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PtcWm+8AAAIaSURBVHjarNRBSBRRHMfxddtiDwVd2uiSYJReEinqUnQIcwsigg0EEZMOeViog0hSRhB0UChQVNolgooQo1AQrKRTabCdig4VSyAebAsCtcColvz+4TfwmGYWbXrwYYd57/32zZs3/6r+woFYSNuJZhzCDmzV/c/4iOcYPbd/uhg0uSoguBZXcQoLeIa3+KL+FHajEZvxCJf5gw9uSMIXehb9mMMZjOBnyBOtRwsu4vXAq4PnCc97nXFnYBdyuI0G3KkQau2XxjRoTo7wLn9wGr3oQRbLsVU2VrmMrOb2Ep72gpMYwjiuxf6xEW5zxzBMeNL2uBXVehlRWyfslLTaijOYwmzUVFY9q6xMXJs/7fQfxYR+vWbbdVOS7lgeewLu2BeWmdC5/Op02Eusx3Y80b1j6ND1U+1l2FjLStmKF7HRCb6P7/r1WkF7V9R1pbFbsGQrfoc9TkefuG0euwK2tY999Y+tw3tb8SSOY1PUl8de25OfwGMLvoUN6P4Px61b30Y+rmp1BRdwJMJqDyvDClLJ+6Rv6IiN61yvNTSj+Q8w6NaKsmqvlcCHOL3KzBpC72rOKNpZbdlfNq2StcEeaZtz3wr2OpTwW3370CSfrHwSOFKpHnurj+nQX1fB97cfeKmP5h6hf5XXRMgjnsQlfFMxn9FK/2iFJdVjqw+BAWHBe/US7LQs6d7cWl5oUPCMasCbKAd6RYABAI51ljBZHWwqAAAAAElFTkSuQmCC) 16px center no-repeat;padding-left:45px;color:#666;font-size:14px;margin-bottom: 0;}
.kf .contact{margin-top:1px;height: auto;}
.kf .contact p{height:26px;line-height:26px;color:#666;font-size:14px;padding-left:22px;margin: 0;}
.kf .contact p:nth-child(2n){padding-left:32px;}
.kf .con h5.qr-icon{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAATCAYAAACUef2IAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDoyZTE5N2VlOC04Njk5LWU0NDUtOGMxNi02NmRjODAxZTZlNzgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QjQzOERGMjg5MDZEMTFFNkI0QUVBMjBCRUFERjM0MkQiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QjQzOERGMjc5MDZEMTFFNkI0QUVBMjBCRUFERjM0MkQiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6YzMwYzA3MjItMmJhOC1hZjQyLThjMjUtZTdmYjM0OTA1NmFkIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjJlMTk3ZWU4LTg2OTktZTQ0NS04YzE2LTY2ZGM4MDFlNmU3OCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PtX1QQcAAAQJSURBVHjajFVNiFxFEK6q7n5v5u3OLpvdiCBxFSJiNJFFRSKCJ4MaQYNuyEEMMSLoRdSDrF48aCSCB8V4CYvBMEsQQQ8hingQFFSCoDmIImuISEhMItndmZ33Xnd1We/N/oKELaaZnv6prvq+r2rwvc+vh8aIAV+WEDGApXQvIR0ExLuQcBQEIMZ4HgC+lxg/iCLfiIkAAcAQVNu1IQpEIdjUNND+8SrYalFEdMPc7IxpG+t2RopXxMdTMec/IyFaa27XRx4Hck+gxE9CLJ9WjwUg1J4RlyZrzNa/UbZbZ39CS73uhYUHpRe/HtycQHduHgpH0GqNQChzsA6fNy790FE6EajcKRKvgCCwxDr6tUYCkpGxJ5nDXK/T2WEG7KwbcE9KJKuhQkJOsYAhMmZvKP1MsVjcRwZvMcYe5zKClAxX5xfBR1mKfCliN0gvKxY35kVxGzCfaw0PXpSWXBci35mkQ2dI4QQDjyYubXNwn/a6+WTRyw+kzfQjxnSXBPhKTFHhuT5ik9BBZv6u0Uh+azYHIHj/Tsh5mrvxL44Rekpozv508PFYCOUJ1JcQ6ZgSOqt3n7VNUtKk5mkdxnpoSyjLo935LqTNBJJG9m7wmlYQYIwQDAN7/iN6PmCjAWPtqHP23hgloJGH0MDrg2nzF0P4rTqfWyUPxAhSHhR9FQC4+mUEVQ7Ef3Xa03XWlTECN2KfUbLeUL62YCUJqT9vDg9kGjX/Gpjf0hszlYsqj0vWmPtHhlqQJelSSqKPREgzgWwTQjZmIR1wh4homgz1na6xCjIR3KaEtlNnpjoFAylJbSTYAyWMgLKsc2VUwCQArqUZDAm4UdpjGmaqelM5OKxjatWtfKyyewEq7eh+18Ohu28a2EVnLy8czpwVSsxnlfhWTMHzkaBkhMj0isSVGqsqIq64lbpE+vipLeQCE+PZS3Yx5wuq8N1KxCkie0K1vg9EQSWqh/Qra1vfi2Zj7avL1dovZdyvX/uXH6oKpVPAPTaxBAr6Fyz8MKFra0YnVYQLeuYHJfMsoRnX+fBqhOtl9f8mYMfHMlhkXwXzJVnJtSfs1ruzRLivdiHI2mBoQ/5W7XfKUqeEqT7JPKLs/hw53qpRb/Ud2cqlPFD6xTu8968h0kYCVV+qGUdHLPuyUm2F1eky4mPaIILVTU1i1hiZZWSlG99Wfif04CRcI3LShsUFH80vd2ZIOEA9Il+CussucU/LAsB6aAE8pdm8r2uh2qgbDi5roTqvCvLlkc4/3eeK8z2tvJWOhNfMUh2V2tle1M427RpuUmtiu9ZkS8m8qGX2t1F1hDKcyzEHd4PrN/oNWRV1rBoQnmEJZwqFsAkZiPYUykj/gfzxxKY7RjcnJFq2/wkwAIyD+y7ytVzxAAAAAElFTkSuQmCC) 16px center no-repeat;}
.kf .con .qr{margin-top:10px;padding-left:40px;}
.kf .con .qr img{width:110px;height:110px;}
.kf .backTop{width:100%;height:40px;margin-top:10px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJIAAACMCAYAAACXp/BlAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3FpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQyIDc5LjE2MDkyNCwgMjAxNy8wNy8xMy0wMTowNjozOSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDowNjZhZmQ4NS1lYWY3LWY3NGMtOWY0YS00OGQ1YzQwMzZkOWEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDE1Rjk1RjA4RTdDMTFFOTlGODFGMjcwRDU5NDc3QkUiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDE1Rjk1RUY4RTdDMTFFOTlGODFGMjcwRDU5NDc3QkUiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjA2NmFmZDg1LWVhZjctZjc0Yy05ZjRhLTQ4ZDVjNDAzNmQ5YSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDowNjZhZmQ4NS1lYWY3LWY3NGMtOWY0YS00OGQ1YzQwMzZkOWEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6lraVaAAACSklEQVR42uza0arbMBBF0frg//9llT5cKBfaJvEktWbWfrUjgmYhnOBjrfVDulpsgUASSAJJAknv6XzwPj/t9KvjyokEkf5pIRCpApNnJHnYFkgCSXoe0mGL9IiJvPpBQfR759UFJM9IAkkgCSQJJIEkkDSi0xb8tT+9RuN/NSfSZURf17yrBdIlRK/cBxJEMIH0fkQwgVSOYYGkdbN1QBqMaDSmQLTVuiANQjQSUyCCCaQ9hrtAgggmkG43zAUSRDCBdLvhLZAg+t4BU39I60M4YGoM6VOIYGoM6dOIYGoI6X8hGo8pEJW/yD8SUyDyaw6keyIaiSkQwTQd0t0RjcIUiGCaCmk3RCMwBSKYpkHaHVFrTIEIpimQuiFqiSkQwdQdUndErTAFIpi6QpqGqAWmQARTN0jTEW2NKRDB1AUSRA0wBSKYdocEUSNMgQimXSFB1BBTIIJpN0gQNcYUiGDaBRJEAzAFIpjuDgmiQZgCEUx3hQTRQEyBCKYKTIEIpgpMgQimCkyBCKaKeQYimCrmGohgqphvIIKpYs6BCKaKeQcimCrmHohgqph/IIKpAlMggqkCUyCCqaLc+cvptpjWuyFBNPRkCkSqmF8gUsUcA5FemOfxLKQDIpgeuXY+segCaCSmh+Z+FinV8Oem2CdVBJJAEkgCSQJJIAkkgSSBJJAEkkCSQBJIAkkCSSAJJIEkgSSQBJJAkkASSAJJIEkgCSSBJIEkkASSQJJAEkgCSSBJIAkkgdSno+gekCSQ3n8qOY2+9VOAAQCGso0XIjvImwAAAABJRU5ErkJggg==) center center no-repeat #e62022;background-size:18px auto;cursor:pointer;}
.kf-side{padding:18px 10px 10px;background:#e62022;position:absolute;top:50%;transform:translateY(-50%);-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);left:-34px;cursor:pointer;}
.kf-side b{display:block;color:#fff;line-height:18px;font-size:14px;font-weight:400;}
.kf-side span.arrow{width:12px;height:12px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJgAAACWCAYAAAAiyEFRAAAACXBIWXMAAAsTAAALEwEAmpwYAAAGtmlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDIgNzkuMTYwOTI0LCAyMDE3LzA3LzEzLTAxOjA2OjM5ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgKFdpbmRvd3MpIiB4bXA6Q3JlYXRlRGF0ZT0iMjAxOS0wNi0xMVQxMTowNDo0MyswODowMCIgeG1wOk1vZGlmeURhdGU9IjIwMTktMDYtMTFUMTE6MDU6NDUrMDg6MDAiIHhtcDpNZXRhZGF0YURhdGU9IjIwMTktMDYtMTFUMTE6MDU6NDUrMDg6MDAiIGRjOmZvcm1hdD0iaW1hZ2UvcG5nIiBwaG90b3Nob3A6Q29sb3JNb2RlPSIzIiBwaG90b3Nob3A6SUNDUHJvZmlsZT0ic1JHQiBJRUM2MTk2Ni0yLjEiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDZmZjlmYjUtN2M0OS0xMjQyLThiZDgtNjk2ZTFjZWVlZGNkIiB4bXBNTTpEb2N1bWVudElEPSJhZG9iZTpkb2NpZDpwaG90b3Nob3A6ZmU0MTY1MzUtOGQ1MC01NzQ3LWFmZTUtNzU5NmZjNmEzMGRmIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6NzNmMmVjOGQtNzU2NC00MDQxLTgyNTYtZjE4MjBkMjY2ZTIyIj4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDo3M2YyZWM4ZC03NTY0LTQwNDEtODI1Ni1mMTgyMGQyNjZlMjIiIHN0RXZ0OndoZW49IjIwMTktMDYtMTFUMTE6MDQ6NDMrMDg6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAoV2luZG93cykiLz4gPHJkZjpsaSBzdEV2dDphY3Rpb249InNhdmVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOjI0YTAzN2Q0LWUzMjEtODU0ZC05N2I5LWViNWY1OWE2MTFlMSIgc3RFdnQ6d2hlbj0iMjAxOS0wNi0xMVQxMTowNToxNyswODowMCIgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgc3RFdnQ6Y2hhbmdlZD0iLyIvPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0ic2F2ZWQiIHN0RXZ0Omluc3RhbmNlSUQ9InhtcC5paWQ6NDZmZjlmYjUtN2M0OS0xMjQyLThiZDgtNjk2ZTFjZWVlZGNkIiBzdEV2dDp3aGVuPSIyMDE5LTA2LTExVDExOjA1OjQ1KzA4OjAwIiBzdEV2dDpzb2Z0d2FyZUFnZW50PSJBZG9iZSBQaG90b3Nob3AgQ0MgKFdpbmRvd3MpIiBzdEV2dDpjaGFuZ2VkPSIvIi8+IDwvcmRmOlNlcT4gPC94bXBNTTpIaXN0b3J5PiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PsYkyA4AAAT0SURBVHic7d3bbupAEETRIsr//zLn4cQJVzP29PSluuqZSGhpB4ixncv1eoW2uz2gi9uziN2nSN46fBs/EaaN/ObdPoYxttFXn+1xTwZfds+FZleMwz7+HMvMDBTY/WYjYYjM1ECB/c0qjsqRmRsosP+rHIXVlhgosDWw1YJdZtA9sGohrNhSg86BKS4Hg66BKS4ng46BKS4/g2u3wBSXs0GnwBSXv8GlS2CKK8igQ2CKK9CAPTDFFWzAHFgkbJZTd8INWAMLh02wFAaMgeltMZEBW2DRsBlevVIZMAWWCjZo6QxYAksHG7CUBgyBpYR1XlqD6oGlhXVcaoPKgaWGdVp6g6qBpYd1WAmDioGVgF28MgbVAisDu3ClDCoFVgp20coZVAmsHOyClTSoEFhJWOOVNcgeWFlYw5U2yBxYaVijlTfIGlh5WINRGGQMjAJ2cjQG2QKjgZ0YlUGmwKhgT47OIEtgdLAnRmmQITBK2IOjNYgOjBb2wKgNIgOjhh0cvUFUYPSwA2thEBFYC9gPa2PgHVgb2J21MvAMrBXsm7Uz8AqsHeyLtTTwCKwl7MPaGqwOrC3szVobrAysNezP2husCqw9LGQAYE1ggpXB76wDE6wM7mYZmGBl8DSrwAQrg5ezCEywMni72cAEK4PdzQQmWBl83NnABCuDoZ0JTLAyGN7RwAQrg0M7EphgZXB4o4EJVganNhKYYGVwep8CE6wMprYXmGBlML13gQlWBiZ7FZhgZWC2x8AEKwPT3QYmWBmYL/ruOtvoYE+M0mALLMU/EA+eDBYs+hWMFvbAqA0iA6OGHRy9QVRg9LADa2HwBf/PHi1gP6yNQfRnMI18X/D/bYo+1pRhbQy63qM1w1oYdL7LdIbRG0R/BqMHHhi1wRZY5F81WYBlsGDRr2DbaIEPjNLgNrDoYzMZgGVgvMdXMAHLwHSv3iIFLAOzvfsMJmAZmGzvQ76AZTC9T39FClgGUxs5TCFgGZze6HEwAcvg1I4caBWwDA7v6JF8Acvg0M58VSRgGQzv7HeRApbB0Ga+7BawDD5u9mwKActgdxan6whYBm9ndT6YgGXwcpYnHApYBk+zPqNVwDK424pTpgUsg9+tOidfwDIAsPaiDwHLYPlVRe2B0dzA47K11sA/a2vgdV1kW+CbtTTwvPC2JfDD2hl4X9ndDvjFWhlE3DqgFfCbtTHoeo9WReZk0Pku04rMwSD67jr0wAOjNogODCAHHhytQYbAAGLgA6M0yBIYQAp8cHQGmQIDCIFPjMogW2AAGfDJ0RhkDAwgAp4YhUHWwAAS4MmVN8gcGEAAbLDSBtkDA4oDG62sQYXAgMLAhitpUCUwoCiw8coZVAoMKAi8YKUMqgUGFANetDIGFQMDCgEvXAmDqoEBRYAXL71B5cCAAsAOS21QPTAgObDT0howBAYkBnZcSgOWwICkwM5LZ8AUGJAQOGCpDNgCA+KBMyyNAWNggP7BO5DEgDUwIAlw8MINmAMDEr1VBC7UgD0wQJEBgQYdAgMUGRBk0CUwQJEB/gbXToEBigxwNugWGKDIAD+DS8fAAEUGOBl0DQxQZICDQefAAEUGLDboHhiwBrhauMsMFNj/VQtixZYYKLC/WQFXjtXcQIHdbxa4clzbTA0U2PMuOIfMENc2M4Pv+edCuw1r79QbpqhebcTg9nFP+wfB4BU8BZwT3wAAAABJRU5ErkJggg==) no-repeat;-ms-background-size:auto 12px;background-size:auto 12px;display:block;margin-top:10px;}
.kf-side span.on{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJgAAACWCAYAAAAiyEFRAAAACXBIWXMAAAsTAAALEwEAmpwYAAAF62lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDIgNzkuMTYwOTI0LCAyMDE3LzA3LzEzLTAxOjA2OjM5ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgKFdpbmRvd3MpIiB4bXA6Q3JlYXRlRGF0ZT0iMjAxOS0wNi0xMVQxMTowNDo0MyswODowMCIgeG1wOk1vZGlmeURhdGU9IjIwMTktMDYtMTFUMTE6MDU6MzYrMDg6MDAiIHhtcDpNZXRhZGF0YURhdGU9IjIwMTktMDYtMTFUMTE6MDU6MzYrMDg6MDAiIGRjOmZvcm1hdD0iaW1hZ2UvcG5nIiBwaG90b3Nob3A6Q29sb3JNb2RlPSIzIiBwaG90b3Nob3A6SUNDUHJvZmlsZT0ic1JHQiBJRUM2MTk2Ni0yLjEiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MjBmZmZhYTEtM2IwNC00YTRh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) no-repeat;-ms-background-size:auto 12px;background-size:auto 12px;}
</style>
<script>
$(document).ready(function() {
  // 判断是否已经保存了状态
  if (localStorage.getItem('sidebarStatus') === 'expanded') {
    openSidebar();
  } else {
    closeSidebar();
  }

  // 点击侧边栏
  $(".kf-side").click(function() {
    var rt = $('.kf').css("right");
    var num = parseInt(rt);
    if (num < 0) {
      openSidebar();
    } else {
      closeSidebar();
    }
  });

  $(".close").click(function() {
    closeSidebar();
  });

  $(".backTop").click(function() {
    $("html,body").animate({
      scrollTop: 0
    });
  });

  // 打开侧边栏
  function openSidebar() {
    $('.kf').animate({
      right: '20px'
    }, "slow");
    $('.kf .kf-side span.arrow').addClass('on');
    // 保存状态到浏览器缓存
    localStorage.setItem('sidebarStatus', 'expanded');
  }

  // 关闭侧边栏
  function closeSidebar() {
    $('.kf').animate({
      right: '-208px'
    }, "slow");
    $('.kf .kf-side span.arrow').removeClass('on');
    // 保存状态到浏览器缓存
    localStorage.setItem('sidebarStatus', 'collapsed');
  }
});
</script>

html代码:

<div class="kf" style="right: 20px;" >
    <div class="kt-top" style="background-color:#3974b8">在线客服 <span class="close"> <b></b> <b></b> </span> </div>
    <div class="con">
        <ul class="qq">
            <li>
                <a class="IM-item-link IM-qq" style="height:25px;" target="_blank" href="http://wpa.qq.com/msgrd?v=3&amp;uin=1810216796&amp;site=qq&amp;menu=yes"> <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAVCAYAAABLy77vAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjRBMDI1MUI2MDZGOTExRThBNzcwQjRCNDE2QTYyRUM1IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjRBMDI1MUI3MDZGOTExRThBNzcwQjRCNDE2QTYyRUM1Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NEEwMjUxQjQwNkY5MTFFOEE3NzBCNEI0MTZBNjJFQzUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NEEwMjUxQjUwNkY5MTFFOEE3NzBCNEI0MTZBNjJFQzUiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6Mk91KAAADQklEQVR42nxUa0hUQRT+7t2Hpa675rpabim9jB6WGNaK2ss2s6cEmUr0JwQrhbI//QiiIDGKqAiMHiBBD8rEsjCFSCLTIqOHqKWg6Ja5Ue2uz+u605mru626euDjnDkz8815zIwAH7LGvCucVD5hG2ERQSC0EZ4RLtZXlf+YuEfwQbKP1HVCIHzLICGHyG57OxUTSDJI3SOoMbUoCenGBUvaLG0tn9xO0YskdCwSWY7lHsTNS+cQbghFsE6L4gtncbIgH4LgSaKY9syeRESSS9BwY55xDvbu3o73Hz9jz4407NiSgt6+fqRt3oCl0Yvc6wMIeb6I0v4XbvTUoSEJCoUIURSRuGa1HA23vSTVO1+3RLqNji4Lyp4+x/pEE06cKcKQJCE5IR5dlm58aWrxJpo7qWuU719SWlFkSFz8B8sieqHXSNDMcMrzjkElrHY1mr4H4vW3YDhH5K026p7OExEzxRyvG+gOuKPSolmjQuba74iNsvtsWTMRNVoCYfjLkC3Z/DeZYq4Kbz4dlmldpph6MuK5bRFVqFH6o0srInDuEGbqhiluAQN2BXo7/RDyG1jn7MdCl+TmthKRQY6o2C+4P1OyQ8dGEOEaRpZko2mMYpwMjB/RARUqTYdcI6pNLOkGPzDccDQj0sWgFmdiOnHM0qPCT4tbDiccgtxFE4/okNxqqnufWo2eP61wUWT6lWb4J1F3bdSDERcQpKW+RgErY6ExzkPr+ctwVL9wcx/mRCmeu6DQwRiwGMM8f/NOYH/OlFH19Y9LcyMnCvMMh0cLqBLpqc0Kmza99s5O7+FsTsQ9/FtQVysCTOHR0dDrQ4AVq6Yk6e6xoqPTws23BH5P5ivHrjn3pt1XB5U1B0XgWmHhtNHcKS0HY4ybRYQn/Hl6JlltqCoj21xHXWR3Hz1mUwk9ZGZKTWd7s8zv+J5Jp5DzwUBNGCvIS5IXltx7yJxO5ziS6pev2Kb0TFZwJJnxtbSndNJbI2ctvw884vKGMJS8MkISwhG3ajlUShUaW75i0N6GA4ld2B33E2PfUoOQYI2bSDSH1KmxmhmI0PqhQ1t3pSqy0ukS2NHU9q2xkbZ4IjDQ/C9CJeE0Ecnt+yfAAGYIRgwuAi9IAAAAAElFTkSuQmCC" alt="点击这里给我发消息" onerror="$(this).hide();" border="0" align="absmiddle"> 客服</a>
            </li>

        </ul>
        <h5>联系方式</h5>
        <div class="contact">
            <p>热线电话</p>
            <p>139XXXX1234</p>
            <p>上班时间</p>
            <p>周一到周五</p>
            <p>公司电话</p>
            <p>021-123456</p>
        </div>
        <h5 class="qr-icon">二维码</h5>
        <div class="qr"><img src=""> </div>
    </div>
    <div class="kf-side" style="background-color:#3974b8"> <b>在</b><b>线</b><b>客</b><b>服</b> <span class="arrow on"></span> </div>
    <a  href="#topAnchor"><div class="backTop" style="background-color:#3974b8"></div></a>
</div>

css代码:

.img-center {text-align: center;font-size: 0;}
.img-center img {display: inline-block;width: auto;height: auto;max-width: 100%;max-height: 100%;vertical-align: middle;-webkit-transition: all 0.5s;transition: all 0.5s;}

.img-cover {overflow: hidden;position: relative;}
.img-cover span {display: block;width: 100%;background: no-repeat center / cover;-webkit-transition: all 0.5s;transition: all 0.5s;height: 100%;position: absolute;left: 0;top: 0;}

.container {padding: 0 15px;width: 1200px;margin: 0 auto;}

.kf{width:208px;position:fixed;/* right: 20px; */right:-208px;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);z-index:10;}
.kt-top{height:40px;line-height:40px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAAAACXBIWXMAAAsTAAALEwEAmpwYAAAFEmlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDIgNzkuMTYwOTI0LCAyMDE3LzA3LzEzLTAxOjA2OjM5ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgKFdpbmRvd3MpIiB4bXA6Q3JlYXRlRGF0ZT0iMjAxOS0wNi0xMVQxMDoxMjowOCswODowMCIgeG1wOk1vZGlmeURhdGU9IjIwMTktMDYtMTFUMTA6MTI6NDYrMDg6MDAiIHhtcDpNZXRhZGF0YURhdGU9IjIwMTktMDYtMTFUMTA6MTI6NDYrMDg6MDAiIGRjOmZvcm1hdD0iaW1hZ2UvcG5nIiBwaG90b3Nob3A6Q29sb3JNb2RlPSIzIiBwaG90b3Nob3A6SUNDUHJvZmlsZT0ic1JHQiBJRUM2MTk2Ni0yLjEiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6Y2M1NDYwZmMtNTAxMS00ZDRm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) 12px center no-repeat #e62022;-ms-background-size:auto 20px;background-size:auto 20px;padding-left:46px;font-size:14px;color:#fff;}
.kt-top span:hover{-webkit-transform:rotate(90deg);transform:rotate(90deg);}
.kt-top span{width:18px;height:16px;float:right;position:relative;margin:10px 10px 0 0;cursor:pointer;transition:.5s;-webkit-transition:.5s;-moz-transition:.5s;-ms-transition:.5s;-o-transition:.5s;}
.kt-top span b{width:100%;height:2px;background:#fff;display:block;position:absolute;top:50%;left:0;}
.kt-top span b:first-child{transform:rotate(45deg);-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);}
.kt-top span b:last-child{transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);}
.kf .con{overflow:hidden;background:#fff;}
.kf .qq li{height:36px;line-height:36px;border-bottom:#f5f5f5 solid 1px;padding-left:16px;}
.kf .qq li a{height:36px!important;color:#666;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-decoration:initial;display:block;}
.kf .qq li a img{padding-right:6px;}
.kf .con h5{height:26px;line-height:26px;margin-top:12px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDoyZTE5N2VlOC04Njk5LWU0NDUtOGMxNi02NmRjODAxZTZlNzgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OTVDRkMyOTI5MDZEMTFFNkE2N0E5OEY2ODE3RkY3N0EiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OTVDRkMyOTE5MDZEMTFFNkE2N0E5OEY2ODE3RkY3N0EiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6YzMwYzA3MjItMmJhOC1hZjQyLThjMjUtZTdmYjM0OTA1NmFkIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjJlMTk3ZWU4LTg2OTktZTQ0NS04YzE2LTY2ZGM4MDFlNmU3OCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PtcWm+8AAAIaSURBVHjarNRBSBRRHMfxddtiDwVd2uiSYJReEinqUnQIcwsigg0EEZMOeViog0hSRhB0UChQVNolgooQo1AQrKRTabCdig4VSyAebAsCtcColvz+4TfwmGYWbXrwYYd57/32zZs3/6r+woFYSNuJZhzCDmzV/c/4iOcYPbd/uhg0uSoguBZXcQoLeIa3+KL+FHajEZvxCJf5gw9uSMIXehb9mMMZjOBnyBOtRwsu4vXAq4PnCc97nXFnYBdyuI0G3KkQau2XxjRoTo7wLn9wGr3oQRbLsVU2VrmMrOb2Ep72gpMYwjiuxf6xEW5zxzBMeNL2uBXVehlRWyfslLTaijOYwmzUVFY9q6xMXJs/7fQfxYR+vWbbdVOS7lgeewLu2BeWmdC5/Op02Eusx3Y80b1j6ND1U+1l2FjLStmKF7HRCb6P7/r1WkF7V9R1pbFbsGQrfoc9TkefuG0euwK2tY999Y+tw3tb8SSOY1PUl8de25OfwGMLvoUN6P4Px61b30Y+rmp1BRdwJMJqDyvDClLJ+6Rv6IiN61yvNTSj+Q8w6NaKsmqvlcCHOL3KzBpC72rOKNpZbdlfNq2StcEeaZtz3wr2OpTwW3370CSfrHwSOFKpHnurj+nQX1fB97cfeKmP5h6hf5XXRMgjnsQlfFMxn9FK/2iFJdVjqw+BAWHBe/US7LQs6d7cWl5oUPCMasCbKAd6RYABAI51ljBZHWwqAAAAAElFTkSuQmCC) 16px center no-repeat;padding-left:45px;color:#666;font-size:14px;margin-bottom: 0;}
.kf .contact{margin-top:1px;height: auto;}
.kf .contact p{height:26px;line-height:26px;color:#666;font-size:14px;padding-left:22px;margin: 0;}
.kf .contact p:nth-child(2n){padding-left:32px;}
.kf .con h5.qr-icon{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAATCAYAAACUef2IAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTExIDc5LjE1ODMyNSwgMjAxNS8wOS8xMC0wMToxMDoyMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDoyZTE5N2VlOC04Njk5LWU0NDUtOGMxNi02NmRjODAxZTZlNzgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QjQzOERGMjg5MDZEMTFFNkI0QUVBMjBCRUFERjM0MkQiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QjQzOERGMjc5MDZEMTFFNkI0QUVBMjBCRUFERjM0MkQiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6YzMwYzA3MjItMmJhOC1hZjQyLThjMjUtZTdmYjM0OTA1NmFkIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjJlMTk3ZWU4LTg2OTktZTQ0NS04YzE2LTY2ZGM4MDFlNmU3OCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PtX1QQcAAAQJSURBVHjajFVNiFxFEK6q7n5v5u3OLpvdiCBxFSJiNJFFRSKCJ4MaQYNuyEEMMSLoRdSDrF48aCSCB8V4CYvBMEsQQQ8hingQFFSCoDmIImuISEhMItndmZ33Xnd1We/N/oKELaaZnv6prvq+r2rwvc+vh8aIAV+WEDGApXQvIR0ExLuQcBQEIMZ4HgC+lxg/iCLfiIkAAcAQVNu1IQpEIdjUNND+8SrYalFEdMPc7IxpG+t2RopXxMdTMec/IyFaa27XRx4Hck+gxE9CLJ9WjwUg1J4RlyZrzNa/UbZbZ39CS73uhYUHpRe/HtycQHduHgpH0GqNQChzsA6fNy790FE6EajcKRKvgCCwxDr6tUYCkpGxJ5nDXK/T2WEG7KwbcE9KJKuhQkJOsYAhMmZvKP1MsVjcRwZvMcYe5zKClAxX5xfBR1mKfCliN0gvKxY35kVxGzCfaw0PXpSWXBci35mkQ2dI4QQDjyYubXNwn/a6+WTRyw+kzfQjxnSXBPhKTFHhuT5ik9BBZv6u0Uh+azYHIHj/Tsh5mrvxL44Rekpozv508PFYCOUJ1JcQ6ZgSOqt3n7VNUtKk5mkdxnpoSyjLo935LqTNBJJG9m7wmlYQYIwQDAN7/iN6PmCjAWPtqHP23hgloJGH0MDrg2nzF0P4rTqfWyUPxAhSHhR9FQC4+mUEVQ7Ef3Xa03XWlTECN2KfUbLeUL62YCUJqT9vDg9kGjX/Gpjf0hszlYsqj0vWmPtHhlqQJelSSqKPREgzgWwTQjZmIR1wh4homgz1na6xCjIR3KaEtlNnpjoFAylJbSTYAyWMgLKsc2VUwCQArqUZDAm4UdpjGmaqelM5OKxjatWtfKyyewEq7eh+18Ohu28a2EVnLy8czpwVSsxnlfhWTMHzkaBkhMj0isSVGqsqIq64lbpE+vipLeQCE+PZS3Yx5wuq8N1KxCkie0K1vg9EQSWqh/Qra1vfi2Zj7avL1dovZdyvX/uXH6oKpVPAPTaxBAr6Fyz8MKFra0YnVYQLeuYHJfMsoRnX+fBqhOtl9f8mYMfHMlhkXwXzJVnJtSfs1ruzRLivdiHI2mBoQ/5W7XfKUqeEqT7JPKLs/hw53qpRb/Ud2cqlPFD6xTu8968h0kYCVV+qGUdHLPuyUm2F1eky4mPaIILVTU1i1hiZZWSlG99Wfif04CRcI3LShsUFH80vd2ZIOEA9Il+CussucU/LAsB6aAE8pdm8r2uh2qgbDi5roTqvCvLlkc4/3eeK8z2tvJWOhNfMUh2V2tle1M427RpuUmtiu9ZkS8m8qGX2t1F1hDKcyzEHd4PrN/oNWRV1rBoQnmEJZwqFsAkZiPYUykj/gfzxxKY7RjcnJFq2/wkwAIyD+y7ytVzxAAAAAElFTkSuQmCC) 16px center no-repeat;}
.kf .con .qr{margin-top:10px;padding-left:40px;}
.kf .con .qr img{width:110px;height:110px;}
.kf .backTop{width:100%;height:40px;margin-top:10px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJIAAACMCAYAAACXp/BlAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3FpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQyIDc5LjE2MDkyNCwgMjAxNy8wNy8xMy0wMTowNjozOSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDowNjZhZmQ4NS1lYWY3LWY3NGMtOWY0YS00OGQ1YzQwMzZkOWEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDE1Rjk1RjA4RTdDMTFFOTlGODFGMjcwRDU5NDc3QkUiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDE1Rjk1RUY4RTdDMTFFOTlGODFGMjcwRDU5NDc3QkUiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjA2NmFmZDg1LWVhZjctZjc0Yy05ZjRhLTQ4ZDVjNDAzNmQ5YSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDowNjZhZmQ4NS1lYWY3LWY3NGMtOWY0YS00OGQ1YzQwMzZkOWEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6lraVaAAACSklEQVR42uza0arbMBBF0frg//9llT5cKBfaJvEktWbWfrUjgmYhnOBjrfVDulpsgUASSAJJAknv6XzwPj/t9KvjyokEkf5pIRCpApNnJHnYFkgCSXoe0mGL9IiJvPpBQfR759UFJM9IAkkgCSQJJIEkkDSi0xb8tT+9RuN/NSfSZURf17yrBdIlRK/cBxJEMIH0fkQwgVSOYYGkdbN1QBqMaDSmQLTVuiANQjQSUyCCCaQ9hrtAgggmkG43zAUSRDCBdLvhLZAg+t4BU39I60M4YGoM6VOIYGoM6dOIYGoI6X8hGo8pEJW/yD8SUyDyaw6keyIaiSkQwTQd0t0RjcIUiGCaCmk3RCMwBSKYpkHaHVFrTIEIpimQuiFqiSkQwdQdUndErTAFIpi6QpqGqAWmQARTN0jTEW2NKRDB1AUSRA0wBSKYdocEUSNMgQimXSFB1BBTIIJpN0gQNcYUiGDaBRJEAzAFIpjuDgmiQZgCEUx3hQTRQEyBCKYKTIEIpgpMgQimCkyBCKaKeQYimCrmGohgqphvIIKpYs6BCKaKeQcimCrmHohgqph/IIKpAlMggqkCUyCCqaLc+cvptpjWuyFBNPRkCkSqmF8gUsUcA5FemOfxLKQDIpgeuXY+segCaCSmh+Z+FinV8Oem2CdVBJJAEkgCSQJJIAkkgSSBJJAEkkCSQBJIAkkCSSAJJIEkgSSQBJJAkkASSAJJIEkgCSSBJIEkkASSQJJAEkgCSSBJIAkkgdSno+gekCSQ3n8qOY2+9VOAAQCGso0XIjvImwAAAABJRU5ErkJggg==) center center no-repeat #e62022;background-size:18px auto;cursor:pointer;}
.kf-side{padding:18px 10px 10px;background:#e62022;position:absolute;top:50%;transform:translateY(-50%);-webkit-transform:translateY(-50%);-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);left:-34px;cursor:pointer;}
.kf-side b{display:block;color:#fff;line-height:18px;font-size:14px;font-weight:400;}
.kf-side span.arrow{width:12px;height:12px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJgAAACWCAYAAAAiyEFRAAAACXBIWXMAAAsTAAALEwEAmpwYAAAGtmlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDIgNzkuMTYwOTI0LCAyMDE3LzA3LzEzLTAxOjA2OjM5ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgKFdpbmRvd3MpIiB4bXA6Q3JlYXRlRGF0ZT0iMjAxOS0wNi0xMVQxMTowNDo0MyswODowMCIgeG1wOk1vZGlmeURhdGU9IjIwMTktMDYtMTFUMTE6MDU6NDUrMDg6MDAiIHhtcDpNZXRhZGF0YURhdGU9IjIwMTktMDYtMTFUMTE6MDU6NDUrMDg6MDAiIGRjOmZvcm1hdD0iaW1hZ2UvcG5nIiBwaG90b3Nob3A6Q29sb3JNb2RlPSIzIiBwaG90b3Nob3A6SUNDUHJvZmlsZT0ic1JHQiBJRUM2MTk2Ni0yLjEiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDZmZjlmYjUtN2M0OS0xMjQyLThiZDgtNjk2ZTFjZWVlZGNkIiB4bXBNTTpEb2N1bWVudElEPSJhZG9iZTpkb2NpZDpwaG90b3Nob3A6ZmU0MTY1MzUtOGQ1MC01NzQ3LWFmZTUtNzU5NmZjNmEzMGRmIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6NzNmMmVjOGQtNzU2NC00MDQxLTgyNTYtZjE4MjBkMjY2ZTIyIj4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDo3M2YyZWM4ZC03NTY0LTQwNDEtODI1Ni1mMTgyMGQyNjZlMjIiIHN0RXZ0OndoZW49IjIwMTktMDYtMTFUMTE6MDQ6NDMrMDg6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAoV2luZG93cykiLz4gPHJkZjpsaSBzdEV2dDphY3Rpb249InNhdmVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOjI0YTAzN2Q0LWUzMjEtODU0ZC05N2I5LWViNWY1OWE2MTFlMSIgc3RFdnQ6d2hlbj0iMjAxOS0wNi0xMVQxMTowNToxNyswODowMCIgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgc3RFdnQ6Y2hhbmdlZD0iLyIvPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0ic2F2ZWQiIHN0RXZ0Omluc3RhbmNlSUQ9InhtcC5paWQ6NDZmZjlmYjUtN2M0OS0xMjQyLThiZDgtNjk2ZTFjZWVlZGNkIiBzdEV2dDp3aGVuPSIyMDE5LTA2LTExVDExOjA1OjQ1KzA4OjAwIiBzdEV2dDpzb2Z0d2FyZUFnZW50PSJBZG9iZSBQaG90b3Nob3AgQ0MgKFdpbmRvd3MpIiBzdEV2dDpjaGFuZ2VkPSIvIi8+IDwvcmRmOlNlcT4gPC94bXBNTTpIaXN0b3J5PiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PsYkyA4AAAT0SURBVHic7d3bbupAEETRIsr//zLn4cQJVzP29PSluuqZSGhpB4ixncv1eoW2uz2gi9uziN2nSN46fBs/EaaN/ObdPoYxttFXn+1xTwZfds+FZleMwz7+HMvMDBTY/WYjYYjM1ECB/c0qjsqRmRsosP+rHIXVlhgosDWw1YJdZtA9sGohrNhSg86BKS4Hg66BKS4ng46BKS4/g2u3wBSXs0GnwBSXv8GlS2CKK8igQ2CKK9CAPTDFFWzAHFgkbJZTd8INWAMLh02wFAaMgeltMZEBW2DRsBlevVIZMAWWCjZo6QxYAksHG7CUBgyBpYR1XlqD6oGlhXVcaoPKgaWGdVp6g6qBpYd1WAmDioGVgF28MgbVAisDu3ClDCoFVgp20coZVAmsHOyClTSoEFhJWOOVNcgeWFlYw5U2yBxYaVijlTfIGlh5WINRGGQMjAJ2cjQG2QKjgZ0YlUGmwKhgT47OIEtgdLAnRmmQITBK2IOjNYgOjBb2wKgNIgOjhh0cvUFUYPSwA2thEBFYC9gPa2PgHVgb2J21MvAMrBXsm7Uz8AqsHeyLtTTwCKwl7MPaGqwOrC3szVobrAysNezP2husCqw9LGQAYE1ggpXB76wDE6wM7mYZmGBl8DSrwAQrg5ezCEywMni72cAEK4PdzQQmWBl83NnABCuDoZ0JTLAyGN7RwAQrg0M7EphgZXB4o4EJVganNhKYYGVwep8CE6wMprYXmGBlML13gQlWBiZ7FZhgZWC2x8AEKwPT3QYmWBmYL/ruOtvoYE+M0mALLMU/EA+eDBYs+hWMFvbAqA0iA6OGHRy9QVRg9LADa2HwBf/PHi1gP6yNQfRnMI18X/D/bYo+1pRhbQy63qM1w1oYdL7LdIbRG0R/BqMHHhi1wRZY5F81WYBlsGDRr2DbaIEPjNLgNrDoYzMZgGVgvMdXMAHLwHSv3iIFLAOzvfsMJmAZmGzvQ76AZTC9T39FClgGUxs5TCFgGZze6HEwAcvg1I4caBWwDA7v6JF8Acvg0M58VSRgGQzv7HeRApbB0Ga+7BawDD5u9mwKActgdxan6whYBm9ndT6YgGXwcpYnHApYBk+zPqNVwDK424pTpgUsg9+tOidfwDIAsPaiDwHLYPlVRe2B0dzA47K11sA/a2vgdV1kW+CbtTTwvPC2JfDD2hl4X9ndDvjFWhlE3DqgFfCbtTHoeo9WReZk0Pku04rMwSD67jr0wAOjNogODCAHHhytQYbAAGLgA6M0yBIYQAp8cHQGmQIDCIFPjMogW2AAGfDJ0RhkDAwgAp4YhUHWwAAS4MmVN8gcGEAAbLDSBtkDA4oDG62sQYXAgMLAhitpUCUwoCiw8coZVAoMKAi8YKUMqgUGFANetDIGFQMDCgEvXAmDqoEBRYAXL71B5cCAAsAOS21QPTAgObDT0howBAYkBnZcSgOWwICkwM5LZ8AUGJAQOGCpDNgCA+KBMyyNAWNggP7BO5DEgDUwIAlw8MINmAMDEr1VBC7UgD0wQJEBgQYdAgMUGRBk0CUwQJEB/gbXToEBigxwNugWGKDIAD+DS8fAAEUGOBl0DQxQZICDQefAAEUGLDboHhiwBrhauMsMFNj/VQtixZYYKLC/WQFXjtXcQIHdbxa4clzbTA0U2PMuOIfMENc2M4Pv+edCuw1r79QbpqhebcTg9nFP+wfB4BU8BZwT3wAAAABJRU5ErkJggg==) no-repeat;-ms-background-size:auto 12px;background-size:auto 12px;display:block;margin-top:10px;}
.kf-side span.on{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJgAAACWCAYAAAAiyEFRAAAACXBIWXMAAAsTAAALEwEAmpwYAAAF62lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDIgNzkuMTYwOTI0LCAyMDE3LzA3LzEzLTAxOjA2OjM5ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgKFdpbmRvd3MpIiB4bXA6Q3JlYXRlRGF0ZT0iMjAxOS0wNi0xMVQxMTowNDo0MyswODowMCIgeG1wOk1vZGlmeURhdGU9IjIwMTktMDYtMTFUMTE6MDU6MzYrMDg6MDAiIHhtcDpNZXRhZGF0YURhdGU9IjIwMTktMDYtMTFUMTE6MDU6MzYrMDg6MDAiIGRjOmZvcm1hdD0iaW1hZ2UvcG5nIiBwaG90b3Nob3A6Q29sb3JNb2RlPSIzIiBwaG90b3Nob3A6SUNDUHJvZmlsZT0ic1JHQiBJRUM2MTk2Ni0yLjEiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MjBmZmZhYTEtM2IwNC00YTRh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) no-repeat;-ms-background-size:auto 12px;background-size:auto 12px;}

js代码

<script>
$(document).ready(function() {
  // 判断是否已经保存了状态
  if (localStorage.getItem('sidebarStatus') === 'expanded') {
    openSidebar();
  } else {
    closeSidebar();
  }

  // 点击侧边栏
  $(".kf-side").click(function() {
    var rt = $('.kf').css("right");
    var num = parseInt(rt);
    if (num < 0) {
      openSidebar();
    } else {
      closeSidebar();
    }
  });

  $(".close").click(function() {
    closeSidebar();
  });

  $(".backTop").click(function() {
    $("html,body").animate({
      scrollTop: 0
    });
  });

  // 打开侧边栏
  function openSidebar() {
    $('.kf').animate({
      right: '20px'
    }, "slow");
    $('.kf .kf-side span.arrow').addClass('on');
    // 保存状态到浏览器缓存
    localStorage.setItem('sidebarStatus', 'expanded');
  }

  // 关闭侧边栏
  function closeSidebar() {
    $('.kf').animate({
      right: '-208px'
    }, "slow");
    $('.kf .kf-side span.arrow').removeClass('on');
    // 保存状态到浏览器缓存
    localStorage.setItem('sidebarStatus', 'collapsed');
  }
});
</script>

 

© 版权声明
THE END
喜欢就支持一下吧
点赞1
相关推荐
评论 抢沙发

请登录后发表评论

    暂无评论内容