JSFiddle - React, Tailwind, and code Playground

HTML

<a href="#" class="gototop">Top</a>

CSS

body {
    margin:0;
    min-height: 800px;
}
.gototop {
    position: fixed;
    bottom: 0;
    right: 20px;
    height: 60px;
    background: yellow;
    display: none;
    color: black;
    text-decoration: none;
}

JavaScript

var Blue = {
    MIN_SCROLL_HEIGHT: 200,
    button: null,
    buttonVisibleFlag: null,

    init: function () {
        this.button = $(".gototop");
        this.buttonVisibleFlag = false;
        this.setWindowBindings();
    },
    setWindowBindings: function () {
        $(window).scroll(function () {
            Blue.impress();
        });
    },
    impress: function () { 
        if ($(window).scrollTop() > this.MIN_SCROLL_HEIGHT && !this.buttonVisibleFlag) { 
            this.button.slideDown(400, function() {
                Blue.buttonVisibleFlag = true;
            });
        }
        else if ($(window).scrollTop() <= this.MIN_SCROLL_HEIGHT && this.buttonVisibleFlag) {
            this.button.slideUp(400, function() {
                Blue.buttonVisibleFlag = false;
            });
        }
    }
}

$(document).ready(function () {
    Blue.init();
});