Question

这是非常具体的，所以我不能在互联网上找到答案！

我有一些代码正在加载一些我希望在悬停时显示的图像。一切正常但有时在单击使用悬停功能的div中的复选框时会有延迟。

jQuery(document).ready(function(){

$icons = [];

$('#boat_icon').hide();

jQuery('.boat_row').each(function(e){
            $icons.push('url("' + $(this).attr("id") + '")');
            });

jQuery($icons).each(function(e){

jQuery('#boat_icon').css('background-image', this);

console.log(this + "loaded!");

});

$('#boat_icon').show();
});

 jQuery('.boat_row').hover(function(e){
     e.preventDefault();

     $(this).css('background-color', 'D8EAFF')

     var iconpath = $(this).attr("id");
     $('#boat_icon').css('background-image', 'url("'+iconpath+'")');
     },

     function(){
     $(this).css('background-color', '')
 });

iconpath是数据库中的一个字符串，所以我想知道......这是使用预加载图像的正确方法吗？因为图像是在准备好时加载的，然后它们是从缓存中使用还是每次在悬停时再次加载它们因为我没有显示存储的图像对象？

Answer 1

你应该使用这个预加载：

if (document.images)
{
  pic1= new Image(100,25); 
  pic1.src="http://someplace.com/image1.gif"; 
}

if (document.images)用于验证浏览器是否支持图像预加载

这些预装图像是否正确使用？

1 个答案: