jquery - Jquery Slide不滑动

Question

我的 jquery 幻灯片没有滑动，它真的只是出现。如果我做.show，我可以看到动画，但我希望它从上到下出现。我已经尝试了以下相同的结果（只是出现，没有动画）：

$(document).ready(function () {

    $('#aboutLink').click(function () {
        console.log("click");
        $('#content').slideDown(3000);
    });

});

和

$(document).ready(function () {

    $('#aboutLink').click(function () {
        console.log("click");
        $('#content').slideDown('slow');
    });   
});

CSS：

.content {
    background-color:#E8E8E8;
    min-height:700px;
    margin-left:22px;
    margin-right:auto;
    border-radius: 0px 0px 10px 10px; 
    -moz-border-radius: 0px 0px 10px 10px; 
    -webkit-border-radius: 0px 0px 10px 10px;
    display:none;
}

HTML

    <div class="grid_11 content" id="content">

    </div>

Answer 1

它试图寻找height property.

The .slideDown() method animates the height of the matched elements.

但是你只定义了min-height

尝试将其替换为height : 700px

检查小提琴

像这样的东西

 $('#aboutLink').click(function () {
     console.log("click");
     $('#content').animate({
         height: '400px'
     }, 3000);
 });

但要使这个工作，您需要确保该元素没有隐藏在页面上。否则它将无法正常工作。

动画小提琴