css - IE7/IE8无背景图像闪烁

Question

我目前正在开发一个网站，该网站使用 jQuery superfish 插件来构建一个 3 级深下拉菜单，其中包含圆 Angular 、阴影和所有其他我们 Web 开发人员喜欢的头部撞击、屏幕粉碎、愤怒煽动的东西。

客户端使用的是IE8，还有IE7。在每个菜单的末尾，我在菜单底部的圆 Angular 末尾放置了一个 24 位圆形透明图像。所以我的代码如下:

<ul id="nav">
 <li><a href="#">Item one</a></li>
 <li><a href="#">Item one</a></li>
 <li><a href="#">Item one</a></li>
 <li>
  <a href="#">Item one</a>
  <ul>
   <li>
    <a href="#">Another item</a>
   </li>
   <li class="lastli2"><img src="images/lastli2.png" /></li>
  </ul>
 </li>
 <li class="lastli"><img src="images/lastli.png" /></li>
</ul>

如您所见，我没有在最后一个元素上使用背景图像，因为它们只是 LI 元素内的图像。当在 IE7 和 IE8 中悬停时(我假设 IE6 也是如此)你会看到最后一张图片闪烁，就像它正在加载或其他东西一样。我试过预加载图像，但这似乎没有任何区别。如果图像在标记中，它无论如何都应该加载。

所以我的问题是，如何才能阻止不是背景图像的图像在我的导航栏中闪烁？这几乎就像它也可以是透明的东西，但我什至不知道从哪里开始。

**** 更新 ****

我解决了这个问题。导致延迟的是菜单上的淡入淡出效果。我删除了 FX，问题就解决了。感谢所有提供帮助的人。

Answer 1

将它们设为背景图像，甚至可能将它们合并到同一个透明 PNG 中。然后只需将 bg 图像应用于这些元素，指定宽度/高度和溢出隐藏可能将其切断。为每个指定一个背景位置，你应该很好。