缩小HTML图像的快速方法？

Question

我知道缩小图像的3种主要方法：

1. 使用img标签WIDTH HEIGHT
2. 将所有图像放入DIV，然后缩放整个div。
3. 使用ctrl +鼠标滚轮进行用户缩放。

我有一些包含大量图片的页面。我注意到的是这些方法之间存在巨大的速度差异。方法1很快就杀死了firefox。方法3似乎是我尝试的所有broswers中最快的。

有没有人知道其他任何方法？有没有办法通过javascript / css指定浏览器缩放级别应该是什么，所以我至少可以使用最快的方式？

Answer 1

客户端上的简单操作是缩放服务器上的图像并将它们发送到浏览器，但是服务器端需要一些严重的CPU电源（除非你缓存它们，然后再提供它们）。您可以使用PHP quite easily实现此目的。根据您的目的，您可以简单地编写一个脚本来获取目录中的所有图像，调整它们的大小并将它们保存到“thumbs /".

如果你不想在服务器上使用任何东西，我会选择选项1或者问为什么在一个页面上有这么多的图像。尝试添加一些分页或其他东西。如果浏览器在使用这种调整图像大小的基本方法时速度变慢，则可能会按顺序进行一些重构。

Answer 2

如果您要调整图像大小，为什么不让图像本身变小。这将加载你尝试的任何方法中最快的。您可以使用PHP创建缩略图大小的图像，并在需要查看时使用指向完整大小图像的链接。请记住，即使您使用高度/宽度调整图像大小，浏览器仍会加载完整图像。

有关图像大小调整的教程，请参阅http://articles.sitepoint.com/article/image-resizing-php。