Javascript/jQuery - 将值添加到整数会更改其他变量

Question

我编写的一段代码在用户滚动经过 div 框时立即放大链接时遇到了一些奇怪的事情。我正在使用这段代码:

function resize_links() {
    $(".all_planes a").css({fontSize: "16px"})
    $( ".plane_container" ).each(function( ) {
        var offtop = $(this).offset().top;
        var scrolltop = $(window).scrollTop();

        var type = $(this).data("type");

        if(scrolltop > offtop) {
            if (window.console) console.log(scrolltop + " " + offtop + " " + type);

            $("." + type + "_link").css({
                fontSize: "20px"
            });
        }
    });
}
$( window ).scroll(function() {
    resize_links();
});

上面的函数可以工作，但是当我向 scrolltop 变量 (scrolltop = scrolltop + 98) 添加一些像素以说明固定 header 时，不合逻辑的事情就会发生我的网站上有。通过查看控制台，我发现在这种情况下，scrolltop 和 offtop 的值是相同的。没有 98，offtop 是逻辑上应该是的常量值。
我试图从 scrolltop 中减去一个值，看看这是否会有所不同，令人惊讶的是，一切都按应有的方式工作。 我还停用了其他 JS 代码以检查是否有干扰，但我也无法通过这种方式找到解决方案。
可能值得注意的是，.plane_container div 是使用 jQuery .html() 方法加载到网站上的。 代码:

$('document').ready(function(){
    var startupcont = $(".skyline_cont").html();
    $(".sky_go_switch").html(startupcont);   
});

所以有一些非常奇怪的事情以某种方式发生，如果您需要看更多的东西来了解这个问题，那么我当然会把它添加到我的问题中。提前致谢!

编辑:
基本上这就是我想要实现的目标:https://jsfiddle.net/xs5rov25/

编辑 2:
我不知何故被困在这里，似乎没有任何意义。只要我向 scrolltop 添加任何值，offtop 值就会变得疯狂。 但我可能发现了一个提示:如果我省略动态加载的东西，只是将内容直接发布到 .sky_go_switch div 中，我的代码工作正常 - 即使添加了 98。 是否有不同的方式来管理动态加载(用户可以控制显示哪些内容 - 有两个选项 - 请参阅此 fiddle :https://jsfiddle.net/1Lret7vk/4/)？或者有没有办法更改我当前的 resize_links 代码以使其适用于我的情况？

编辑 3:
好的，所以我终于能够在我的 fiddle 中重现这个问题。我合并了我创建的两个 fiddle ，现在您可以看到问题了。
没有 98 - 工作版本:https://jsfiddle.net/a5jxw2jd/
添加 98 - 疯狂的事情开始发生:https://jsfiddle.net/72jkfxkw/
您可以看到所有链接的大小都随着第二个 fiddle 中的第一个滚动而立即调整。这是因为 scrolltop 在某种程度上与 offtop then 相同(请参阅控制台)。

Answer 1

我真的无法解释为什么(因为我想你没有 + 98 的 fiddle 应该有同样的问题)，但我知道你可以通过改变选择器从“.box”到“.switcher_content .box”。我想这与不可见元素的偏移位置会产生奇怪的结果这一事实有关，并且由于您正在为每个评估的 .box 更新所有 #_link 元素，因此不可见的元素会覆盖可见框的正确值。 但是就像我说的，我无法解释为什么在没有 + 98 的版本中没有发生同样的事情......