Html 加速图库页面

我有一个带有jQuery库插件的HTML页面。画廊拍摄了15张图片和15张缩略图。现在页面加载有点慢，我想提高页面加载速度。我有几个基本问题：

如果在图像上指定了

显示：none

，我知道它不会占用文档流中的空间，但它仍在下载吗

如果不是，我可以下载第一张图片，在页面的其他部分加载完毕后，让其他人预加载

如果同一个图像在一个页面上被指定两次，它是下载一次还是两次

我不想先加载15张图像，然后再加载15个缩略图，我想我会将较大的图像也用作缩略图，指定

高度

和

宽度

属性使它们变小

比如说,

任何其他加快进程的指针都会非常有用。提前感谢。：）

是的，它们仍然被下载（实际上是常见的预加载技巧）

重复的图像只下载一次

您从哪里获得jQuery插件？

---

从google API加载jQuery将允许浏览器通过google缓存脚本，这将略微提高您和您的用户的速度。

图像是否在您的主页上？如果没有，则可以先预加载图像

在此处查看演示，然后单击导航栏上的“多媒体资料”

创建image-preload.js文件并粘贴，然后填写图像位置

将此代码添加到标题中

<script type="text/javascript" src="../js/image-preload.js"></script>

---

压缩图像，减少dom元素，使用firebug查看什么需要更多的时间，并尝试减少。您还可以使用AJAX发布加载所有其他图像…嗯，我将查看这两个评论，但您能否回答我的两个问题？谢谢。你可以自己查看网页加载时浏览器开发工具的“网络”选项卡。你能用图片描述一下你的滑块是什么样子的吗？因为我想知道缩略图在哪里，所以我预装了一些图片，这些图片将在主页加载后显示在不同的页面上？？当用户访问其他页面时，它们不会再次被加载吗？

function preloader() {
    if (document.images) {
        var img1 = new Image();
        var img2 = new Image();
        var img3 = new Image();
        var img4 = new Image();
        var img5 = new Image();
        var img6 = new Image();
        var img7 = new Image();
        var img8 = new Image();
        var img9 = new Image();
        var img10 = new Image();
        var img11 = new Image();
        var img12 = new Image();
        var img13 = new Image();
                var img14 = new Image();
                var img15 = new Image();


        img1.src = "../images/#####.jpg";
        img2.src = "../images/#####.jpg";
        img3.src = "../images/#####.jpg";
        img4.src = "../images/#####.jpg";
        img5.src = "../images/#####.jpg";
        img6.src = "../images/#####.jpg";
        img7.src = "../images/#####.jpg";
        img8.src = "../images/#####.jpg";
        img9.src = "../images/#####.jpg";
        img10.src = "../images/#####.jpg";
        img11.src = "../images/#####.jpg";
        img12.src = "../images/#####.jpg";
        img13.src = "../images/#####.jpg";
        img14.src = "../images/#####.jpg";
        img15.src = "../images/#####.jpg";

    }
}
function addLoadEvent(func) {
    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
        window.onload = func;
    } else {
        window.onload = function() {
            if (oldonload) {
                oldonload();
            }
            func();
        }
    }
}
addLoadEvent(preloader);