Question

愚蠢的问题，但我似乎无法弄清楚这一点。

我有一个div并在页面加载时隐藏它

$("e").hide();

然后，当用户对某个特定动作进行操作时，我希望div能够优雅地动画或向下滑动。但是在我的网站上，动画只是闪烁并穿上隐藏的div，没有褪色或slideDown效果。

我用

$("#e").hide();
$("#p").change(function() {
    if ($("#p").val() === 'Married') {
        $("#e").slideDown(500);
    } else {
        $("#e").slideUp(500);
    }
});

Answer 1

您可以使用animate执行相同的操作animate。

$("#e").hide();
$("#p").change(function(){
    if($("#p").val() === 'Married'){
        $("#e").animate( { "opacity": "show", top:"100"} , 500 );
    }else{
        $("#e").animate( { "opacity": "show", top:"150"} , 5000 );
    }
});

上下滑动你可以玩div的高度和宽度。

Answer 2

而不是：

 {
    $("#e").slideDown(500);
 } else {
    $("#e").slideUp(500);
 }

写下这个：

$("#e").toggle(500);

这将显示或隐藏您的DIV。这是一线解决方案。

Answer 3

使用Toggle功能执行此操作。

$("#p").toggle(function(){
    // Your toggle code here
});

Answer 4

您可以使用Animate Animate 简单的例子：

$("#p").animate({ opacity: 0 }, 600).prependTo($list);

其中list是父

它适用于所有浏览器

Answer 5

我意识到这已经有多年历史了，但是到达这里寻找相同的信息后，您现在可以使用一个持续时间来为您做滑动动画了。例如：

$("#p").change(function() {
  $("#e").toggle(500);
});

还有很多options available。

Answer 6

为什么不只是$("#e").fadeOut(250);或其他什么？

如何动画在jquery中显示隐藏的div？

6 个答案: