Question

我有一些img标记src已更改onmouseover。这需要花费过多的时间来加载。如何改善加载时间？图像基本上只是不同的图标。

Answer 1

你可以做一些事情。

1）CSS Sprites可能是首选方法。

2）您可以在div中加载图像并将该div设置为none，使图像已经加载，因此在鼠标悬停时它们会立即存在。

还有here's a link关于如何使用CSS预览图像

Answer 2

有几种方法可以做到这一点，在你的情况下，理想的解决方案是使用CSS精灵，因为它们是图标。但是，根据情况，有时精灵并不理想。

这是使用JavaScript预加载图像的一种解决方案：

var images = new Array();

function preload() {
  for (i = 0; i < preload.arguments.length; i++) {
    images[i] = new Image();
    images[i].src = preload.arguments[i];
  }
}

preload(
  'http://image-1.jpg',
  'http://image-2.jpg',
  'http://image-3.jpg'
);

Answer 3

您要做的是实现翻转。很奇怪，你在这个过程中经历了很长的延迟。通常，如果图像没有存储在某个远程位置，那么它们的速度非常快。

查看this文章以获得一些指导

您可以尝试的其他事项： - css中的精灵 - 你可以使用两个重叠的div并隐藏一个而取消隐藏另一个，反之亦然

改善图像加载时间

3 个答案: