这是一款纯js qq在线客服悬浮代码。该qq在线客服会一直悬浮在页面的右侧,跟随页面一起滚动。并且该qq在线客服带有二维码,兼容ie8浏览器,非常实用。

使用方法

在页面中引入style.css和qq.js文件。

<link rel="stylesheet" href="css/style.css">
<script type="text/javascript" src="js/qq.js"></script>                  
                
HTML结构

在页面底部添加qq在线客服的HTML代码如下:

<!--在线客服  -->
<div class="scrollsidebar" id="scrollsidebar">
  <div class="side_content">
    <div class="side_list">
      <div class="side_title"><a title="隐藏" class="close_btn"><span>关闭</span></a></div>
      <div class="side_center">
        <div class="custom_service">
          <p> 
          <a title="点击这里给我发消息" href="###" target="_blank"><img src="http://wpa.qq.com/pa?p=2:8983659:41"></a>
          </p>
        </div>
        <div class="other">
          <p><img src="images/qrcode.png" width="120"/></p>
          <p>客户服务热线</p>
          <p>0755-400-12345</p>
        </div>
        <div class="msgserver">
          <p><a href="###" >联系我们</a></p>
        </div>
      </div>
      <div class="side_bottom"></div>
    </div>
  </div>
  <div class="show_btn"><span>在线客服</span></div>
</div>
                

生成的qq在线客服的截图效果如下:

qq在线客服