Javascript Jquery动画功能不工作

我正在使用下面的javascript设置一个div的动画，但是这个div没有设置动画。。。有人知道会发生什么吗

JavaScript:

 <script language="JavaScript">   
    $(document).ready(function(){
    $('#LayoutDiv1').animate({top: "500px"}, 1500); }); 
    </script>

工作演示：

---

定义顶部、左侧、底部和右侧属性时，应指定位置属性。

您需要将

div

位置设置为

相对

#LayoutDiv1 {
    clear: both;
    float: left;
    width: 100%;
    display: block;

    position: relative

}

#LayoutDiv1 {
    clear: both;
    float: left;
    width: 100%;
    display: block;
}

#LayoutDiv1 {
    clear: both;
    float: left;
    width: 100%;
    display: block;

    position: relative

}