简易社交分享浮动块

使用 overtrue/share.js ，github地址: https://github.com/overtrue/share.js
简单易上手。

直接引用包中的 /dist/css/share.min.css
js用 /src/js/social-share.js   /src/js/qrcode.js
jquert用: /dist/js/jquery.share.min.js

<link href="../share.min.css?1557996680" rel="stylesheet">
<script src="../social_share.min.js?1557996680"></script>
<div class="share_block" style="bottom: 100px;width: 36px;z-index: 99999;right: 36px;height: 35px;position: fixed;overflow: visible;margin: 0;padding: 0;">
    <a href="#" onclick="return false;" style="color: #dddddd;width: 36px;height: 35px;display: block;position: absolute;text-decoration: none;cursor: pointer;"><svg t="1558001609007" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1112" xmlns:xlink="http://www.w3.org/1999/xlink" width="35" height="35"><path d="M256 640c0 0 57.6-192 384-192l0 192 384-256-384-256 0 192C384 320 256 480 256 640zM704 768 128 768 128 384l128 0c12.8-12.8 19.2-25.6 32-32C332.8 307.2 384 281.6 441.6 256L0 256 0 896l832 0L832 627.2l-128 83.2L704 768z" p-id="1113" fill="#1296db"></path></svg></a>
    <div class="share_box" style="text-align: left;overflow: hidden;background: #f6f6f6;margin-left: 36px;">
        <div style="height: 28px;color: #626262;overflow: hidden;font-weight: bold;font-size: 14px;line-height: 28px;padding: 0 5px;"><{t}>分享到<{/t}></div>
        <div style="padding: 5px 0;margin: 0;background: #fff;overflow: auto;overflow-x: hidden;"><div class="social-share"></div></div>
    </div>
</div>
 <script>
 $('.share_block').hover(function() {
     // 鼠标移入时添加hover类
     $('.share_box').css('border','solid 1px #e9e9e9');
     $('.share_block').animate({width:'266px'},200);
     $('.share_box').animate({width:'230px'},200);
 }, function() {
     // 鼠标移出时移出hover类
     $('.share_box').css('border','none');
     $('.share_block').animate({width:'36px'},200);
     $('.share_box').animate({width:'0px'},200);
 });
 </script>

social-share 为share.js的默认类，也可以自已指定，详细见文档。