有没有老哥能把bilibili的返回顶部的代码和动画扒下来

jiajieit

有没有老哥能把bilibili的返回顶部的代码和动画扒下来，自己改一下那个图片就能做一个新的动画效果。


html
<div class="to-top" style="display: block; background-position-x: -40px;"></div>

js
源js文件 https://s1.hdslb.com/bfs/static/jinkela/space/space.fdc293d92cc0b67ff0804257dec5e68b7af54cac.js
这段应该是图片动画效果
   methods: {
                    fly: function() {
                        if (!this.isClick) {
                            var t = this,
                                e = $(".to-top");
                            this.isClick = !0, Ct = setInterval(function() {
                                t.keyframes++, e.css({
                                    "background-position-x": -(143 * t.keyframes + 40) + "px"
                                }), 5 === t.keyframes && (e.addClass("transition"), t.$nextTick(function() {
                                    e.addClass("fly")
                                })), 6 === t.keyframes && (t.keyframes = 0, clearInterval(Ct), $("html, body").stop().animate({
                                    scrollTop: 0
                                }, "fast"))
                            }, 50)
                        }
                    }
                }
            },

这段应该是scroll.toTop的代码
mounted: function() {
                    var t = $(window).height(),
                        e = $(".to-top"),
                        i = this;
                    $(window).off("scroll.toTop").on("scroll.toTop", function() {
                        var n = $(window).scrollTop();
                        n - i.lastTrace > 0 ? (i.isClick && (e.removeClass("transition"), i.$nextTick(function() {
                            e.removeClass("fly")
                        }), clearInterval(Ct)), n >= t / 2 && (!i.isVisible && e.stop().fadeIn(100), i.isVisible = !0, i.keyframes = 0, e.css("background-position-x", "-40px")), i.isClick = !1) : n < t / 2 && (i.isVisible && e.stop().fadeOut(100), i.isVisible = !1), i.lastTrace = n
                    })
                },


css
.to-top {
    position: fixed;
    display: none;
    bottom: 100px;
    right: 20px;
    transform: translateY(0);
    width: 62px;
    height: 85px;
    margin-left: 602px;
    cursor: pointer;
    background-image: url(//s1.hdslb.com/bfs/static/jinkela/space/asserts/space-to-top.png);
    background-position: -40px -44px;
}

TIMI

不是一个合格的元老

野兔

学习学习，zsbd