Javascript 触发函数中的jQuery延迟

我的页面中有以下脚本，它是DynamicPage脚本的一部分，并且我添加了一个部分来调用函数以运行图像滑块脚本。它在这里是为了解决我以前遇到的一个问题。它可以工作，但页面加载后会有一瞬间的延迟。下面的图片让你明白我的意思

这是剧本

$(function() {

    var newHash      = "",
        $mainContent = $("#main-content"),
        $pageWrap    = $("#page-wrap"),
        baseHeight   = 0,
        sliderInit = true,
        $el;

    $pageWrap.height($pageWrap.height());
    baseHeight = $pageWrap.height() - $mainContent.height();

    $("navbar").delegate("a", "click", function() { window.location.hash = $(this).attr("href"); return false; });

    $(window).bind('hashchange', function(){
        newHash = window.location.hash.substring(1);
        if (newHash) {
            $mainContent.find("#guts").slideUp(5, function() {
                $mainContent.hide().load(newHash + " #guts", function() {
                    $mainContent.slideDown(5, function() {
                        $pageWrap.animate({height: baseHeight + $mainContent.height() + "px" }, function() {
                            $('#games').coinslider({ navigation: true, height:325, width: 595, hoverPause: true, delay: 5000});
                        });
                    });
                    $("navbar a").removeClass("current");
                    $("navbar a[href='"+newHash+"']").addClass("current");
                });
            });
        };
    });
    $(window).trigger('hashchange');
});

---

我建议您在页面上添加一个覆盖图。比如说，页面顶部的黑白背景隐藏了所有其他内容。现在，当你的函数启动时，淡出这个覆盖，并移除它

$(function() {

var newHash      = "",
    $mainContent = $("#main-content"),
    $pageWrap    = $("#page-wrap"),
    baseHeight   = 0,
    sliderInit = true,
    $el;
                .
                .
                .

$("#MY_OVERLAY").hide('slow');
});

---

您是否尝试过在页面加载完成后使用滑块触发器

$(document).ready(function() {
   $(window).trigger('hashchange');
});

---

您的问题不是javaScript问题，而是Html/CSS问题

事实上，如果你在加载网页时没有使用javaScript，我知道，但人们仍然在使用XP和古老的浏览器，它将停留在你的页面加载示例中

我的建议是有一个隐藏的css类，可以应用于所有多余的附加动态元素。你想要隐藏的东西没有javaScript，或者在你的情况下，额外的图像帧。这样不仅可以防止您看到的不合适的效果，还可以使网站向后兼容。特别重要的是，如果你的客户目标受众可能不懂IT

.preLoadHide {
    visibility:hidden;
}

之后，如果加载了javaScript，请执行以下操作，因为您使用的是jQuery[在应用图像幻灯片效果之前或之后需要进行实验]

jQuery(".preLoadHide").removeClass(".preLoadHide");

请注意，还有一个非常强烈的原因是我们通过

$function{…此处的代码…}

在您的代码上下文中：这确保在加载图像后执行javaScript，因为当没有加载任何内容时，脚本将崩溃/失败/什么都不做，变成什么都不做。因此，您的0.5秒延迟

[由于您的页面仍在加载，事实上，大多数图像都是在浏览器中逐步加载的，当它们第一次出现时，它们实际上不完整的高分辨率细节，我们有时只是没有意识到这一点，减少高分辨率图片是优化的一部分]

---

因此，由于服务器加载时间不是您始终可以控制的，因此最好假定延迟始终存在。因此，使用它=P

不确定您是要添加延迟还是要删除半秒延迟。删除，如果我没有说清楚，很抱歉。嗯……我想知道半秒延迟是否真的是您的问题。你的问题是当页面重新加载时，你会看到底部有一张图片在闪烁？在我看来，在启动幻灯片事件时，DOM还没有准备好。