Question

我正在使用跟随jsfiddle在单击元素时向下滑动div ...

$(document).ready(function() {

    // Initial variables
    var panel = $('#panel');
    var panelHeight = panel.height();

    // Set the height to 0
    panel.height(0);

    // Animate it to its initial size
    $('a').click(function(e) {
        e.preventDefault();
        $('#panel').animate({'height' : panelHeight});
    });
});

http://jsfiddle.net/3fsQr/

当再次点击该元素时，我无法弄清楚如何让它再次消失。有人可以帮忙吗？

Answer 1

我为您提供了另一种选择：

将#panel设置为display: none;

然后您可以使用slideToggle()并保持滑动效果：Demo

如果您想继续使用animate的方式，我已更新您的小提琴以便它可以正常运行：Demo

Answer 2

最佳解决方案是将 #panel div设置为display:none，然后将slideToggle设置为...

 $('a').click(function(e) {
     $('#panel').slideToggle();
 });

Answer 3

最好你可以使用jquery切换。 http://api.jquery.com/toggle/

$('a').click(function(e) {
        e.preventDefault();
        $('#panel').toggle();
    });

无需每次都将高度保持为'0'和原始高度。

jQuery单击时向下滑动

3 个答案: