鼠标悬停需要时间来显示图像

on onmouseover taking time to display image

本文关键字：显示 显示图 图像 时间 悬停 鼠标      更新时间：2023-09-26

我从自定义元框中获得OnMouseover图像，OnMouseout图像是特色图像。

下面是我的代码: 
$image_full = wp_get_attachment_image_src(get_post_thumbnail_id($postid), 'full');
$him = $post_meta['_hover_image'];
<img onmouseover="this.src=''' .$him[0]. '''"
     onmouseout="this.src='''.$image_full[0].'''" src="'.$image_full[0].'"  />

一切正常，但需要时间来显示图像。

这个问题可能是由于加载资源的延迟引起的。为了解决这个问题，您可以在URL上缓存图像，方法是在JavaScript中加载它，如下所示:

function preloadImage(url)
{
    var img=new Image();
    img.src=url;
}
preloadImage($him[0]);
preloadImage($image_full[0]);

如果图像不是动态的，你也可以使用CSS预加载它们。CSS3 image preloading

相关文章：