jQuery slideUp 无法正常工作。

Question

我有一个关于 slideUp() 方法的问题。它仅适用于最后一个元素（面板 3）。前两个滑下来，我不知道为什么.. 请记住，我刚开始使用 jQuery，我真的是一个新手。

这里是 jQuery 代码：

$(document).ready(function () {

    $('.panel').on('click', function() {
        $(this).slideUp(600);
    });

});

这里是 JSfiddle -> http://jsfiddle.net/py4tfq3f/2/

感谢您的宝贵时间！！

Answer 1

将display:inline-block从panel div更改为float:left，即可解决问题。

DEMO

CSS：

.panel {
    margin: 50px 0 0 10px;
    width: 200px;
    height: 200px;
    font-family: tahoma;
    float:left;
    border: 2px solid gray;
    border-radius: 5px;
    overflow: hidden;
}