how to check if page is resized or refreshed

Question

window.addEventListener('resize', function() {
    document.addEventListener('scroll', function() {
        checkScrollHeight();
    });
});

    function checkScrollHeight() {
        let stickyNavbar = document.getElementById('sticky-navbar');
        let currentPosition = window.pageYOffset || document.documentElement.scrollTop;
        let bannerHeight = document.getElementById('banner-height').offsetHeight || document.getElementById('banner-height').clientHeight;

        if(currentPosition > bannerHeight) {
            stickyNavbar.style.display = "block";
            return;
        } else {
            stickyNavbar.style.display = "none";
        }
    }

Currently the function is working when the user resizes the page, but how can I write the code so the function will be called after reloading the page? The navbar should be displayed when it passes the specific height of the banner which will dynamically change based on the screen width.

There is no difference between reloading a page and loading it the first time. — SLaks, Apr 15 '18 at 13:53
you could store something in session storage to detect refreshing. — Daniel A. White, Apr 15 '18 at 13:55
Possible duplicate of [Refresh page and run function after JavaScript](https://stackoverflow.com/questions/41904975/refresh-page-and-run-function-after-javascript) — Heretic Monkey, Apr 15 '18 at 14:01
@SLaks, but the function would not be executed only after resizing the screen. — , Apr 15 '18 at 14:11
@SLaks Not related to the question but there is some difference: Cache images and files - js, css, fonts... — , Apr 15 '18 at 14:11

score 0 · Answer 1 · answered Apr 15 '18 at 13:59

0

Just call it. All your JS is executed afresh when the page reloads.

window.addEventListener('resize', checkScrollHeight );

checkScrollHeight();

answered Apr 15 '18 at 13:59

Ben West

4,398
1
16
16

score 0 · Answer 2 · answered Apr 15 '18 at 14:14

0

Use cookies, if you are using only js here. Like personal lands on page store cookie. After reloading check the cookie. https://www.w3schools.com/js/js_cookies.asp Use this functions for set and get cookies

answered Apr 15 '18 at 14:14

Picks Prabhakar

335
1
3
13

how to check if page is resized or refreshed

2 Answers2