javascript - jQuery代码在滚动后保持运行

我想在header元素超出视口之后显示page元素。为此，我创建了简单的JS：

var scrollHeight = $(document).scrollTop(),
    headerHeight = $('.big-header').outerHeight(true),
    setHead = 0;

    console.log(scrollHeight +' / '+ headerHeight);

if(scrollHeight >= headerHeight) {
    if(setHead == 0) {
        alert(setHead);
        setHead = 1;
    }
}

我的问题是，alert(setHead)一直在运行。我大概忘记了一些小事，但我似乎无法完成。

Fiddle here。

最佳答案

将sethead移出滚动功能，

var setHead = 0;
$(window).scroll(function () {
    var scrollHeight = $(document).scrollTop(),
        headerHeight = $('.big-header').outerHeight(true);


    console.log(scrollHeight + ' / ' + headerHeight);

    if (scrollHeight >= headerHeight) {
        if (setHead == 0) {
            alert(setHead);
            setHead = 1;
        }
    } else {
        setHead = 0;
    }
});

http://jsfiddle.net/9P36u/1/