Window scroll function doesn't pick up condition

I'm not sure how to rephrase this question but basically the jquery doesnt pick up the third condition in the following code:

$(window).scroll(function(event) {


    $(".section").each(function(i, el) {
        var el = $(el);
        if (el.visible(true)) {
            el.addClass("come-in");
        } 
    });

    console.log($(window).scrollTop());
    console.log(homeTop, portfolioTop, contactTop);

    if ($(this).scrollTop() == homeTop) {
        var activeBar = anime({
            targets: '.active-bar',
            translateY: '0px',
            duration: 3000
        });
    } else if ($(this).scrollTop() >= portfolioTop - 200) {
        //console.log("portfolioTop");
        var activeBar = anime({
            targets: '.active-bar',
            translateY: '100px',
            duration: 3000
        });
    } else if ($(this).scrollTop() >= contactTop - 200) {
        console.log("contactTop");
        var activeBar = anime({
            targets: '.active-bar',
            translateY: '200px',
            duration: 3000
        });

    }

});

As you can see in the demo the jquery doesn't pick up the condition (else if ($(this).scrollTop() >= contactTop - 200)). I tried to inject the script in the console and it worked, but not in the document. Do you have any idea what the issue might be?