Javascript JQuery加载动画/转换

我使用jQuery加载方法在单击时加载

div

，工作正常，但我想添加类似slideUp/slideDown效果的动画，但不确定如何实现：

下面是代码

$('.search_bar > input').click(function(){
        $("#search_layer").load("file-url.html");
        $("body").css({"overflow": "hidden", "height": "auto"});
});

有谁能建议如何添加滑动/向下转换吗？我也尝试过CSS转换，但没有成功

提前谢谢

在加载元素后，使用

.load（url，回调）

执行操作。首先通过css将其设置为显示：无

$('.search_bar > input').click(function(){
        $("#search_layer").load("file-url.html");
$("#search_layer").slideToggle();
        $("body").css({"overflow": "hidden", "height": "auto"});
});

$('#search_layer').load(
    'file-url.html',
    function () {
        $('#search_layer .div-to-show').slideDown();
    }
);

在加载元素后，使用

.load（url，回调）

执行操作。首先通过css将其设置为显示：无

$('#search_layer').load(
    'file-url.html',
    function () {
        $('#search_layer .div-to-show').slideDown();
    }
);

你可以用

比如说

$（文档）。在（“单击“，”。搜索栏>输入”，函数（）{
$（此）.velocity（“transition.whirlOut”{ 错开：1000， 持续时间：1000， 完成：函数（）{ //在完成时。。。 } }); });

你可以用

比如说

$（文档）。在（“单击“，”。搜索栏>输入”，函数（）{
$（此）.velocity（“transition.whirlOut”{ 错开：1000， 持续时间：1000， 完成：函数（）{ //在完成时。。。 } }); });

---

可以在load方法中添加回调函数，然后在回调中设置其动画：

您可以在load方法中添加回调函数，然后在回调中设置其动画：

感谢您的输入，@Justinas提供的答案易于使用，使用相同的回调函数感谢您的输入，@Justinas提供的答案易于使用，使用相同的回调函数