当用户将鼠标悬停在图像上时，使图像加载速度尽可能快

make the image load as quickly as possible when user hovers over the image

本文关键字：图像 加载 速度 尽可能 用户 鼠标 悬停      更新时间：2023-09-26

我知道使用精灵会解决这个问题，有没有其他更好的方法?

有些浏览器会加载悬停图像，直到你将鼠标悬停在它上面。如果图像很大或流量很慢，这是非常明显的。

理想情况下，你希望使用Sprites图像，并在悬停时定位它们。

像这样http://cdn.sstatic.net/stackoverflow/img/sprites.png?v=3c6263c3453b

像这样预加载图像到dummydiv -

#temp
{
    background-image: url(/images/image1.png);
    background-image: url(/images/image2.png);
    background-image: url(/images/image3.png);
}

如何在html页面上添加要更改的图像，并使用内联css显示它，以便在html页面呈现时加载，并使用javascript在悬停时更改图像。

相关文章：