0

我试图让一个 Jquery 图像预加载器启动“loading.gif”和图像预加载区域以在页面打开时立即启动（如果这甚至是一个适当的术语），我一直在尝试 javascript 放置和其他东西，但它总是加载对我的口味来说有点太晚了。

这是网址

http://eleven23.net/beta/work/web/lounge22-preload.php

我正在尝试一些变量以使其加载更快

我应该使用哪一个？

$(window).bind("加载", function() {

  • 或者 -

$(document).ready (function() {

</body>此外，我在希望这也能加快 jquery 开始时间之前放置了内联 javascript 。

有什么建议么？

4

3 回答 3

2

我使用过时的图像元素来缓存图像。当它们加载时，我知道它们在浏览器缓存中。如果我想确保它们在附近，我会将它们放在一个不会超出范围的数组中。

var images = [];

// Preload a list of images with an optional callback as a final parameter.
function preload() {
    if ( arguments.length == 0 ) return;
    var waiting = arguments.length - 1,
        count = 0,
        callback = arguments[ arguments.length - 1 ];
    if ( typeof callback == "string" ) {
        callback = function() { };
        waiting++;
    }
    function loaded() {
        if ( ++count == waiting ) callback();
    }
    for ( var i = 0 ; i < waiting ; i++ ) {
        var image = new Image();
        image.onload = loaded;
        image.src = arguments[ i ];
    }
}

preload( "people.gif", "images/star.jpg", "/site/images/panorama.jpg", function() {
    doSomethingWithImages();
});

我很想知道使用图像元素的任何主要缺点。

我在 MDC 上找不到 Image 的原始文档，但这里有一些关于使用 Image 对象的现代文档。

https://developer.mozilla.org/en/Canvas_tutorial/Using_images

但是，该对象早于 Canvas 和 HTML 5。它可以追溯到很久以前。

https://web.archive.org/web/1/http://articles.techrepublic%2ecom%2ecom/5100-10878_11-5214317.html

于 2009-07-22T01:14:39.150 回答
0

$(document).ready() 一旦 DOM 被加载并准备好被操作就会触发。在此处添加加载图像，预加载大图像，然后再次删除加载图像不会真正按您的意愿工作。

您需要将加载图像添加到您的标记中（因此它会立即渲染），然后预加载大图像并在加载时隐藏/删除加载图像。

这里有一个关于使用简单插件预加载图像的好教程 。

于 2009-07-21T23:52:59.253 回答
0

嘿，你可以看看我写的一个很棒的 jQuery Preloader，它带有完整的回调、自动读取要预加载的图像以及大量的动画缓动。在这里查看：jQuery Preloader

于 2010-08-17T08:06:04.923 回答