记录，以后可能自己要用

<style>
    .t-right-side-bar{
        position: fixed;
        width: 50px;
        padding: 10px 0;
        bottom: 144px;
        right: 20px;
        z-index: 886;
    }
    .t-side-toolbar{
        margin-bottom: 10px;
        animation: toolbarout 0.5s;
    }
    .t-side-toolbar .toolbar-item{
        width: 50px;
        height: 50px;
        line-height: 50px;
        text-align: center;
        position: relative;
    }
    .t-side-toolbar .toolbar-item:before{
        position: absolute;
        width: 80%;
        height: 1px;
        background: #f5f5f5;
        bottom: 0;
        left: 10%;
        content: ' ';
        border: 50px;
    }
    .t-to-top{
        width: 50px;
        height: 50px;
        line-height: 50px;
        text-align: center;
        display: none;
    }
    .t-to-top-on{
        animation: toolbar 0.5s;
    }
    .t-to-top-on-tow{
        animation: toolbar 0.7s;
    }
    .t-to-top-on-out{
        animation: toolbarout 0.5s;
    }
    .t-side-toolbar,.t-to-top{
        background: #FFF;
        box-shadow: 0px 5px 40px 0px rgb(17 58 93 / 10%) ;
        border-radius: 3px;
        cursor: pointer;
        transition: all 2s;
        -webkit-transition: all 2s; /* Safari */
    }
    .t-f-s-20{
        font-size: 20px;
    }
    .toolbar-item .t-nav-ewm{
        position: absolute;
        right: 50px;
        bottom: 0;
        width: 110px;
        height: 100px;
        padding-right: 10px;
        overflow: hidden;
    }
    .toolbar-item .t-nav-ewm div{
        width: 100%;
        height: 100%;
    }
    @keyframes toolbar
    {
        from {transform: translateY(30px);}
        to {transform: translateY(0px);}
    }

    @-webkit-keyframes toolbar /* Safari 与 Chrome */
    {
        from {transform: translateY(30px);}
        to {transform: translateY(0px);}
    }
    @keyframes toolbarout
    {
        from {transform: translateY(-30px);}
        to {transform: translateY(0px);}
    }

    @-webkit-keyframes toolbarout /* Safari 与 Chrome */
    {
        from {transform: translateY(-30px);}
        to {transform: translateY(0px);}
    }
    @media screen and (min-width: 1366px) {
        .t-right-side-bar{
            right: 70px;

        }
    }
</style>

<div class="t-right-side-bar" >
    <!---->
    <div class="t-side-toolbar" >
        <div class="toolbar-item" >
            <i class="iconfont icon-taiyang t-f-s-20"></i>
        </div>
        <div class="toolbar-item" id="ctrl_c">
            <i class="iconfont icon-Star"></i>
        </div>
        <div class="toolbar-item" >
            <i class="iconfont icon-erweima"></i>
            <div class="t-nav-ewm">
                <div id="t-qrcode">

                </div>
            </div>
        </div>
        <div class="toolbar-item" >
            <i class="iconfont icon-fenxiang"></i>
        </div>

    </div>

    <div class="t-to-top" >
        <i class="iconfont icon-a-Arrow-Up2"></i>
    </div>
    <!---->
</div>

<script>
    $(function(){
        $(window).scroll(function() {
            var scroHei = $(window).scrollTop();//滚动的高度
            if (scroHei > 800) {
                $('.t-to-top').show().addClass('t-to-top-on-tow');
                $('.t-side-toolbar').addClass('t-to-top-on');
            } else {
                $('.t-to-top').hide().removeClass('t-to-top-on-tow');
                $('.t-side-toolbar').removeClass('t-to-top-on');
            }
        })

        // 返回顶部
        $('.t-to-top').on('click',function () {
          // 设置滚动动画，这里注意使用的是$('body')不是$(window)
          $("html,body").animate({ scrollTop:0},500);
        });

        // 收藏
        $("#ctrl_c").click(function(){
            var ctrl=(navigator.userAgent.toLowerCase()).indexOf('mac')!=-1?'Command/Cmd': 'CTRL';
            if(document.all){
               window.external.addFavorite('http://thinker.e123e.cn/', '听风');
            }
            else if(window.sidebar){
                window.sidebar.addPanel('听风', 'http://thinker.e123e.cn/', "");
            }
            else{ 
                alert('您的浏览器不支持直接收藏，您可以通过快捷键Ctrl + D 加入到收藏夹');
            }

        });

        //二维码
        $('#t-qrcode').qrcode({
            render: "canvas", //也可以替换为table
            width: 100,
            height: 100,
            text: "http://www.jq22.com"
        });

    })
</script>