JSFiddle - React, Tailwind, and code Playground

HTML

<div style="width: 200px; height: 1000px"></div>
<div id="up">SCROLL UP</div>

CSS

#up {
    position: fixed;
    position: fixed;
    top: 0;
    right: 0;
    width: 200px;
    height: 200px;
    background: #ccc;
    display: none
}

JavaScript

$(function () {
    //Keep track of last scroll
    var lastScroll = 0;
    $(window).scroll(function (event) {
        //Sets the current scroll position
        var st = $(this).scrollTop();
        //Determines up-or-down scrolling
        if (st > lastScroll) {
            //Replace this with your function call for downward-scrolling
            $('#up').hide();
        } else {
            //Replace this with your function call for upward-scrolling
            $('#up').show();
        }
        //Updates scroll position
        lastScroll = st;
    });
});