javascript - 根据浏览器高度动画div

Question

我想在用户滚动到网页上的某个高度(例如 600px)时为 DOM 中的某个 div 设置动画。

问题是，我正在通过谷歌搜索，但我找不到任何相关信息——一切都是关于宽松的。

谁能帮我解决这个问题？我正在查看 jQuery 和 Javascript 文档，但仍然一无所获。

Answer 1

试试这个:

var timer;

$(document).scroll(function() {
    clearTimeout(timer);
    timer = setTimeout(function() {
        if ($(document).scrollTop() > 600) {
            $("#myDiv").animate({ height: "100px" });
            $("#myOtherDiv").animate({ width: "225px" });
        }

        if ($(document).scrollTop() > 700) {
            $("#anotherDiv").animate({ height: "300px" });
        }
    }, 100);
});

请注意，这里的计时器很重要，否则您最终可能会无谓地处理数千个 scroll 事件。定时器确保函数在滚动结束后运行。