Question

我在$（window）.Load（）中淡化图像，它很可爱，除了当你进行社交共享时，社交网络脚本有时会出现问题并需要10秒以上才能加载，这意味着在脚本加载之前，图像不会淡入！

有没有办法让以下内容忽略社交脚本？

$(window).load(function() {
   images.fadeIn('slow');
});

正在加载的社交脚本是显示“共享”按钮所需的，它们包括Facebook，Twitter，Pinterest，StumbleUpon和Google+。就在几秒钟之前，“pinterest”脚本被加载了，加载它的代码确实有“异步”，所以我不知道我还能做什么？

Answer 1

有两种选择：

1 - 不要等待window.load

您可以寻找图片加载，而不是等待窗口加载。例如，在HTML下面的图像中使用此脚本（或使用jQuery的ready事件）：

(function() {
    var imgs = $("selector for the images you care about");
    var done = false;

    // Hook both load and error events on the images    
    imgs.on("load error", check);

    // We may well have missed some, so do a proactive check
    check();

    function check() {
        var count = 0;
        if (!done) {
            imgs.each(function() {
                if (this.complete) {
                    ++count;
                }
            });
            if (count === imgs.length) {
                done = true;
                imgs.off("load error");
                // Do your effect
            }
        }
    }
})();

请注意，我们不依赖于获取load事件，因为在我们挂钩之前它可能已经被触发了。因此，如果我们错过了所有加载事件，我们会进行初步检查，然后在我们从任何相关图片中看到load或error时再次检查。

2 - 异步加载相关脚本

不是在标记中使用<script>标记，而是通过将script元素附加到DOM来添加您不想等待的脚本。以这种方式添加的脚本是异步加载的，不会阻止window.load事件。

E.g：

(function() {
    var scripts = [
        "http://example.com/some/script.js",
        "http://example.com/some/another_script.js",
        "http://example.com/some/script3.js"
    };
    var index, script;
    var parent = document.getElementsByTagName("script")[0].parentNode;

    for (index = 0; index < scripts.length; ++index) {
        script = document.createElement("script");
        script.src = scripts[index];
        parent.appendChild(script);
    }
})();

如何使“.load（）”忽略某些脚本？

1 个答案:

1 - 不要等待window.load

2 - 异步加载相关脚本