如何在延遲後動畫頂部％？

Question

我有一個在窗口中間有一個初始位置的div。延遲3秒後，我希望它滑到屏幕的頂部。這是如何實現的？

這裏是我到目前爲止（https://jsfiddle.net/5m363gt1/）：

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的出法：

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

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