如何在延迟后为 top % 设置动画？

Question

我有一个 div，它的初始位置在 window 的中间。延迟 3 秒后，我希望它滑到屏幕顶部。这是如何实现的？

HTML

<div id="red"></div>

CSS

#red{
width: 100px;
height: 100px;
position: absolute;
top: 50%;
background-color: red;
}

jQuery

$("#red").delay(3000).animate({top:'0%'},1000);

Answer 1

您可以创建一个函数并使用来自 jQuery 的 setTimeout 方法：

var onTop = function() {
    $("#red").animate({'top' : '0'});
};

    setTimeout(function(){
    onTop();
}, 3000);

How to animate top % after a delay?