1

我的网页中有很多名称相同但位于不同文件夹中的图像，例如

<div class="wrapper">
  <div id="pictures1" class="effect_1">
    <div><img src="pictures/sample/1/01/1/01.jpg" width="125" height="188"></div>
    <div><img src="pictures/sample/1/01/1/02.jpg" width="125" height="188"></div>
    <div><img src="pictures/sample/1/01/1/03.jpg" width="125" height="188"></div>
    <div><img src="pictures/sample/1/01/1/04.jpg" width="125" height="188"></div>
    <div><img src="pictures/sample/1/01/1/05.jpg" width="125" height="188"></div>
    <div><img src="pictures/sample/1/01/1/06.jpg" width="125" height="188"></div>
    <div><img src="pictures/sample/1/01/1/07.jpg" width="125" height="188"></div>
    <div><img src="pictures/sample/1/01/1/08.jpg" width="125" height="188"></div>
    <div><img src="pictures/sample/1/01/1/09.jpg" width="125" height="188"></div>
    <div><img src="pictures/sample/1/01/1/10.jpg" width="125" height="188"></div>
    <div><img src="pictures/sample/x.gif" width="125" height="188"></div>
 </div>

  <div id="pictures2" class="effect_2">
    <div><img src="pictures/sample/1/02/1/01.jpg" width="125" height="188"></div>
    <div><img src="pictures/sample/1/02/1/02.jpg" width="125" height="188"></div>
    <div><img src="pictures/sample/1/02/1/03.jpg" width="125" height="188"></div>
    <div><img src="pictures/sample/1/02/1/04.jpg" width="125" height="188"></div>
    <div><img src="pictures/sample/1/02/1/05.jpg" width="125" height="188"></div>
    <div><img src="pictures/sample/1/02/1/06.jpg" width="125" height="188"></div>
    <div><img src="pictures/sample/1/02/1/07.jpg" width="125" height="188"></div>
    <div><img src="pictures/sample/1/02/1/08.jpg" width="125" height="188"></div>
    <div><img src="pictures/sample/1/02/1/09.jpg" width="125" height="188"></div>
    <div><img src="pictures/sample/1/02/1/10.jpg" width="125" height="188"></div>
    <div><img src="pictures/sample/x.gif" width="125" height="188"></div>
 </div>

  ..................... up to 09/../../.jpg
</div>

我的页面中有很多图片，这只是为了示例，当我运行我的应用程序时，加载时间过长并突然崩溃...为什么？

4

3 回答 3

1

每个图像的大小（KB 或 MB）是多少？

如果您的图像太大，浏览器需要时间来下载它们。

您指定的width和height仅用于显示原因。

例如，如果您的图像是每个 3MB（2000x2000 像素），浏览器将首先下载图像（3MB），然后以您给他的宽度/高度显示它。

于 2013-09-13T10:24:00.880 回答
0

你只有这个静态 html 还是除了 html 有任何 php 或其他代码？如果有，请提供给我们。

仅使用 html 加载很小的图像应该没有任何问题。用其他浏览器试试？

于 2013-09-13T10:43:20.043 回答
0

将文件放在不同的位置会影响页面的链接，这就是路径如此重要的原因。路径用于创建指向与当前文档不同的文件夹中的文件的链接。要进行链接，您必须指定文件的正确位置或路径，以便浏览器可以找到它。

<div class="wrapper">
  <div id="pictures1" class="effect_1">
    <div><img src="/pictures/sample/1/01/1/01.jpg" width="125" height="188"><img /></div>
    <div><img src="/pictures/sample/1/01/1/02.jpg" width="125" height="188"><img /></div>
 </div>
  <div id="pictures2" class="effect_2">
    <div><img src="/pictures/sample/1/02/1/01.jpg" width="125" height="188"><img /></div>
    <div><img src="/pictures/sample/1/02/1/02.jpg" width="125" height="188"><img /></div>
</div>
于 2013-09-13T11:25:49.953 回答