Make div appear when user scrolls upwards

Question

Hey all I was just wondering how I would create an effect on jquery and/or javascript where when the user scrolled upwards, a div would appear.

Thanks!

show us what you've tried ? is it like a do for me stuff? – Vedant Terkar Jan 22 '14 at 05:04 — Vedant Terkar, Jan 22 '14 at 05:04

score 1 · Accepted Answer · edited Feb 04 '18 at 02:54

If you find a way to detect the scroll up event, then the whole process is too easy.

To detect scroll up I have used to below approach,

$(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;
    });
});

Keep a fixed positioned div and hide/show based on the scroll is what I have done.

JSFiddle

Make div appear when user scrolls upwards

1 Answers1