滚动后显示元素

Question

I am trying to make an element appear when the page goes past a certain Y position, but it appears after I reload the page and then stays on the page and doesn't disappear.

var showScroll = function () {      
    var url = document.URL;
    var urlToTest = 'http://localhost:55054/why-napit/membership-scheme-benefits';
    var divEl = document.getElementById('action');
    if (url == urlToTest) {
        if (document.documentElement.scrollTop >= 800 
            || window.pageYOffset >= 800) {
            divEl.style.display = "block";
        } else {
            divEl.style.display = "none";
        }

    }
}();
window.addEventListener('load', showScroll, false);

I have tried the scroll event but doesn't work, so I assume I'm close but not close enough.

Answer 1

You should handle window.scroll event instead window.load

look this examples https://developer.mozilla.org/en-US/docs/Web/API/window.onscroll#Example_3.3A_Showing_a_link_to_the_top_of_the_page_after_a_scroll