JQuery scroll event doesn't fire immediately after postback

Question

I have a jQuery function to make a div stick to the top of the page, after it is scrolled below the original position. However, after a button click (postback), you have to scroll above the div first before it works again.

I think this may be the troublemaker:

MaintainScrollPositionOnPostback="true"

My jQuery:

$(document).ready(function () {
function fixedNav() {
    if ($(window).scrollTop() > 150) {
        $('#navigation').addClass('fixedNav');
        $('#mainContent').addClass('pushedMainContent');
    }
    else {
        $('#navigation').removeClass('fixedNav');
        $('#mainContent').removeClass('pushedMainContent');
    }
}
function isPostBack() {
    fixedNav();
}
$(window).scroll(function () {
    fixedNav();
})
})

I have been going over the function for an hour and I can't seem to find a fix. (I even added the same function to the isPostBack but that didn't help) Any help/suggestions are appreciated.

Fix: (thank you @charlietfl)

<script>see "My jQuery"</script>
<body onload="fixedNav()">

That seems to work! Thanks a lot, however I don't understand the difference between document.ready and onload — user6875529, Aug 08 '18 at 16:38

score 1 · Answer 1 · answered Aug 08 '18 at 20:09

The problem is that this

$(window).scroll(function() {
    fixedNav();
})

creates a function to be called when someone scrolls, but when the page reloads, nobody is scrolling. And, if I'm not mistaken, the page will load with the classes that are in the markup, not the classes that were last applied.

So you have to manually call fixedNav(), to reapply the new classes.

I don't think this is relevant to your question but google 'document.ready vs onload' for answers to the difference b/t ready and onload. (If you want to compare two things, always use vs when googling.

Here's an SO answer: ready vs onload

That makes a lot of sense. Actually understanding what goes wrong is always better than just a fix. Thanks — user6875529, Aug 08 '18 at 20:17

JQuery scroll event doesn't fire immediately after postback

1 Answers1