javascript - 带有动画/过渡的 JQuery 加载

Question

我正在使用 jQuery 加载方法加载 div，它工作正常，但我想添加像 slideUp/slideDown 效果这样的动画，但不确定如何实现:

代码如下

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

任何人都可以建议如何添加 slideUp/Down 过渡，我也尝试过 CSS 过渡，但没有成功

提前致谢!

Answer 1

使用 .load(url, callback) 在元素加载后做一些事情。首先通过 css 将其设置为 display: none，而不是

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