jquery — обновить функцию в $(window).resize с помощью headroom.js

Я пытаюсь запустить скрипт из headroom.js (https://wicky.nillia.ms/headroom.js/) для срабатывания, когда элемент достигает верхней части страницы. Положение элемента изменится при изменении размера окна.

Моя проблема: значение смещения функции не хочет работать с ним в $(window).resize. Переменная offset обновляет свое значение, но функция не использует его после того, как оно было определено один раз.

Вот мой код: https://jsfiddle.net/kh4jv748/7/

JQuery:

    //https://wicky.nillia.ms/headroom.js/ is already called 


    function updateViewportDimensions() {
        var w=window,d=document,e=d.documentElement,g=d.getElementsByTagName('body')[0],x=w.innerWidth||e.clientWidth||g.clientWidth,y=w.innerHeight||e.clientHeight||g.clientHeight;
        return { width:x,height:y };
    }
    // setting the viewport width
    var viewport = updateViewportDimensions();





    $(document).ready(function() {


    // initiate the headroom plugin to change nav bar behaviour


    function headroom (Offset){
        if( typeof Offset === "undefined" )  var Offset = 50; 
        var $offset = Offset;
        console.log('Vertical offset position from "trigger"', Offset);
        console.log('function headroom initiated');

        $(".top-menu").headroom({
          "offset": $offset,
          "tolerance": {
            "up" : "12", //tolerance scroll back 
            "down" : "0" // tolerance scroll 
            },
          "classes": {
            "initial": "animated",
            "pinned": "slideDown",
            "unpinned": "slideUp",
            "top" : "headroom--top",
            "notTop" : "headroom--not-top"
          }
        });
    };

    headroom();

    $(window).resize(function () {

        var home = $('body').hasClass('home');

        // if we're on the home page, we wait the set amount (in function above) then fire the function
        if( home ) { setTimeout( function() {

        // update the viewport, in case the window size has changed
        viewport = updateViewportDimensions();

          // if we're below 768 fire this off
          if( viewport.width < 768 ) {
            console.log('Home page < 768.');
            var Offset = 0;

          } else {
            // otherwise, let's do this instead
            console.log('Home page > 768');
            var Offset = $("#trigger").offset();
            var Offset = Offset.top
          }

          headroom(Offset);

        }, 2000, "headroom"); }

        else{ setTimeout( function() {
            console.log('Not on home page resized');

            viewport = updateViewportDimensions();

                if( viewport.width < 768 ) {
                console.log('Home page < 768.');
                var Offset = 0;
                console.log(Offset);

              } else {
                // otherwise, let's do this instead
                console.log('Home page > 768');
                var Offset = 500;
                console.log(Offset);
              }

              headroom(Offset);

            }, 2000, "headroom");

        };

    });


    });