Question

我想在header元素离开视口后显示一个页面元素。为实现这一目标，我创建了简单的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

Answer 1

在var setHead = 0;之前定义$(window).scroll(function()。

在您的函数setHead中始终为0。

Answer 2

将您的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/

滚动后jQuery代码继续运行

2 个答案: