.hide和.show显示所有元素，直到用户滚动才能正常运行

Question

你好，所以我正在一个垂直滚动网站，固定的中央图像(主要字符)隐藏和显示取决于用户在哪里使用。scrolltop页面。我遇到的唯一问题是，当页面第一次加载时，每个单独的中心图像都会立即加载并显示。一旦你开始滚动，它就会正常工作，似乎只有在页面第一次加载时才会发生。我在脚本中写错了什么?我认为这与。hide函数不激活，直到用户滚动，但我不知道如何写它不同。

谢谢。

这是我的网址，所以你可以看到我在说什么:

http://pixel.csueastbay.edu/3870/corzine/project1/index.html

下面是js的一个示例:

<script>
$(window).scroll(function() {
if ($(this).scrollTop() > 290) {
    $(".fallingman").hide();
}
if ($(this).scrollTop() < 290) {
    $(".fallingman").show();
}
});


$(window).scroll(function() {
if ($(this).scrollTop() < 290) {
    $(".fallingman2").hide();
}
if ($(this).scrollTop() > 290) {
    $(".fallingman2").show();
}
if ($(this).scrollTop() > 1200) {
    $(".fallingman2").hide();
}
});
</script>

Answer 1

将所需内容放入函数中。然后在页面加载时无条件地调用它，也在滚动处理程序中调用它。

function checkScroll() {
    var pos = $(window).scrollTop();
    if (pos > 290) {
        $(".fallingman").hide();
        $(".fallingman2").show();
    }
    if (pos < 290) {
        $(".fallingman").show();
        $(".fallingman2").hide();
    }
    if (pos > 1200) {
        $(".fallingman2").show();
    }
)
$(function() {
    checkScroll();
    $(window).scroll(checkScroll);
});