jQuery不会使用animate：top 200px函数执行。 但是它会充满生气：高度

Question

There is some straight jQuery that hides the open div when clicked not shown, but still adds the height to the navigation to make it seem like it is dropping down.

This script works okay:

    <script>
    $(document).ready(function(){
        $("#openNav").click(function(){
            $("#nav").animate({height: "200px"});
        });
        $("#closeNav").click(function(){
            $("#nav").fadeOut();
            $("#nav").animate({height: "100px"});
        });
    });
</script>

This doesn't animate at all when clicked:

<script>
$(document).ready(function(){
    $("#openNav").click(function(){
        $("#nav").animate({top: "+100px"});
    });
    $("#closeNav").click(function(){
        $("#nav").fadeOut();
        $("#nav").animate({height: "-100px"});
    });
});

</script>

Answer 1

您需要DOM具有position:relative或absolute ，以使诸如left ， top等的位置属性在css中生效。

Answer 2

#nav应该具有position: relative或position: absolute用于top动画