元素完全可见后调用脚本

Question

我正在使用下面的这个脚本来加载一个隐藏的 div，在另一个里面：

$(document).ready(function(){
    $(function() {
        $('#menu a').click(function(e) {
            e.preventDefault();
            $('#menu a').removeClass("selected");
            $(this).addClass("selected");
            var h = $(this).attr('href');
            $("#conteudo").fadeOut("slow", function() {
                $(this).html($(h).html()).fadeIn("slow");
            });
        });
 });

但在某些页面中，我使用了一些mCustomScrollbar，它仅在 div 未隐藏时才有效。所以我需要在 div 完全可见后调用脚本。如何使用上面的代码做到这一点？

这是滚动条脚本调用：

$("#mcs_container").mCustomScrollbar("vertical",400,"easeOutCirc",1.05,"auto","yes","yes",10);

在脚本的页面中，有这个示例代码，但是我的脚本加载对整个菜单都有效……而这个示例是设置他要携带的页面。我说清楚了吗？

$("#mcs_container .content").load("new.html", function(){
    $("#mcs_container").mCustomScrollbar("vertical",400,"easeOutCirc",1.05,"auto","yes","yes",10);
});

Answer 1

您可以将回调函数传递给.fadeIn() 函数，该函数将在动画结束后执行（使<div> 可见）。它应该看起来像这样：

$("#conteudo").fadeOut("slow", function() {
    $(this).html($(h).html()).fadeIn("slow", function() {
        $("#mcs_container").mCustomScrollbar("vertical",400,"easeOutCirc",1.05,"auto","yes","yes",10);
    });
});