Update-Funktion auf Seite aktualisieren

Question

Ich habe eine einfache JavaScript-Funktion, die das Blättern der Seite erkennt.

Alles funktioniert.

Die einzige Auslassung ist, dass wenn die Seite aktualisiert wird, die Rolle nicht beibehalten wird, muss also wiederhergestellt werden.

Ich dachte, es könnte etwas so einfach sein, wie den direkten Anruf zu docScroll() in pub.init mit etwas wie $(window).on("load", docScroll()); in setBindings ersetzen, aber leider funktioniert das nicht.

Bietet jemand Rat?

var scroll = function() { 
    var pub = {}, timeout = null; 

    function reset() { 
     if (typeof (timeout)) 
      clearTimeout(timeout); 

     timeout = setTimeout(function() { 
      docScoll(); 
     }, 200); 
    } 

    function docScroll() { 
     $body = $("body"); 
     var headerHeight = $("#header").height(); 

     $(document).scroll(function() { 
      if ($(window).scrollTop() > headerHeight) { 
       $body.addClass("scrolling"); 
      } 
      else { 
       $body.removeClass("scrolling"); 
      } 
     }); 
    } 

    function setBindings() { 
     $(window).on("resize", reset); 
    } 

    pub.init = function() { 
     setBindings(); 
     docScroll(); 
    } 

    return pub; 
}(); 

Answer 1

Der Scroll-Ereignishandler sollte einmal festgelegt werden. Also würde ich so etwas tun:

var scroll = function() { 
    var pub = {}; 

    function docScroll() { 
     var $body = $("body"); 
     var headerHeight = $("#header").height(); 

     if ($(window).scrollTop() > headerHeight) { 
      $body.addClass("scrolling"); 
     } 
     else { 
      $body.removeClass("scrolling"); 
     } 
    } 

    function setBindings() { 
     $(document).scroll(docScroll); 
    } 

    pub.init = function() { 
     setBindings(); 
     docScroll(); 
    } 

    return pub; 
}();