0

所以我玩弄当用户将鼠标悬停在我的缩略图上时显示更大(质量更好的图像)的想法。不是它在点击时链接到的全尺寸版本,但仍然是一个显示更多细节的尺寸,前提是它不会增加我的画廊的页面加载时间。

如果可以只在鼠标悬停时加载图像而不是在页面加载时预加载,那就更好了,因为这会阻碍我的速度努力。

这会很难做到吗?

4

1 回答 1

1

您可以使用 CSS 轻松完成此操作,使用background: transparant url('') no-repeat;悬停操作:http: //jsfiddle.net/stidged/DqCcP/。我对 JS 插件不够熟悉,无法推荐其中的任何一个,但我确信它们就在那里!

我的观点是,当您请求非预加载图像时,您有一个简短的实例,其中低分辨率图像消失了,而更好的图像被请求并加载,使其在尚未缓存时闪烁一次。Sprites 弥补了悬停状态图标的错误印象。诚然,这不是世界末日,但它并不理想。

哦,如果您对性能感兴趣,您可能需要查看 Chrome 的 PageSpeed 扩展程序以了解您的网站的运行情况。它也进行图像优化分析,如果有改进的空间,您可以直接从插件中获取优化的图像。此外,了解图像格式和最佳 Photoshop 质量设置可以帮助您在不降低用户体验的情况下节省一些宝贵的千字节。

这是否回答你的问题?

于 2013-04-12T06:21:27.167 回答