jQuery:在页面滚动上显示隐藏的div

Question

jQuery

function showDiv() {
    if ($(window).scrollTop() > 100) {
        $('.lock').fadeIn('slow');
    } else {
        $('.lock').fadeOut('slow');
    });
}
$(window).scroll(showDiv);
showDiv();

HTML (.lock {显示:无；位置:固定；})

<div class="lock">
    Text
</div>

我正在尝试让一个隐藏的固定div在你滚动到页面的某一部分时出现，并在你向上滚动时消失。我做错了什么？

Answer 1

看起来像是语法问题

function showDiv() {
    if ($(window).scrollTop() > 100) {
        $('.lock').fadeIn('slow');
    } else {
        $('.lock').fadeOut('slow');
    }//); <-- drop this close parenthesis/semicolon
}

jsfiddle example

Answer 2

请测试一下:将样式放在div.lock元素中。

<div class="lock" style="display: none; position: fixed;">
    Text
</div>