jquery悬浮在线客服返回顶部代码【超好看超实用】

梦毁

话不多说，看到评论区有位希特勒的友友说来点这种代码没问题老铁！
jquery网页右侧悬浮的返回顶部和在线客服代码，鼠标滑过二维码显示隐藏，js css 分离，js css 注释清晰，下载即可使用。
【https://www.cnue4.com/】
使用方法：
1、head引入css文件

<link href="css/style.css" rel="stylesheet" type="text/css" />
复制代码
2、head引入js文件

<script type="text/javascript" src="js/jquery.js"></script>
复制代码
3、body引入HTML代码


<div class="suspension">

      <a class="consult" target="_blank" title="在线客服">

              <div class="suspension-list" style="display:none;">

                    <div class="suspension-list-content">

                          <ul>

                                  <li>

                                        <div href="javascript:;" class="service-phone">

                                              <span class="info-name">客服热线</span>

                                              <span class="info-value">400-888-xxxx</span>

                                        </div>

                                  </li>

                                  <li>

                                        <div href="javascript:;" class="service-qq">

                                              <span class="info-name">在线客服</span>

                                              <span class="info-value">80099xxxx</span>

                                        </div>

                                  </li>

                                  <li class="suspension-list-bottom">

                                        <div href="javascript:;" class="service-proposal">

                                              <span class="info-name">投诉与建议</span>

                                              <span class="info-value">最快10分钟内回应</span>

                                        </div>

                                  </li>

                          </ul>

                    </div>

              </div>

      </a>

      <a class="cart" title="关注wx公众账号">

              <div class="pic">

                    <div class="pic-content"></div>

              </div>

      </a>

      <a href="javascript:void(0)" class="back-top" style="display: block;" title="返回顶部"></a>

</div>



<script type="text/javascript">

      $(function() {

              $(".back-top").hide();

              $(".back-top").live("click", function() {

                    $('html, body').animate({

                          scrollTop: 0

                    }, 400);

                    return false;

              })

              $(window).bind('scroll resize', function() {

                    if ($(window).scrollTop() <= 400) {

                          $(".back-top").hide();

                    } else {

                          $(".back-top").show();

                    }

              })

      })

</script>
复制代码
里面的图片自己替换即可