鼠标悬停元素闪烁 [英] mouseover element flickers

问题描述

我在网页上有一张图片，当用户将鼠标悬停在该图片上时，会出现另一张图片.然后将鼠标悬停在出现的图像上时，它会闪烁.

I have an image on a webpage and when the user hovers over it, another image appears. When then hovering over the appearing image, it flickers.

有人知道为什么会这样吗?

Anybody any idea why that is?

托尼

更新:悬停时第一张图像不会消失，左上角的顶部仅出现另一张(较小的)图像.现在，当移到那个较小的图像上时，就会出现闪烁.

UPDATE: The first image does not dissapear when hovering, just another (smaller) image appears over the top in the left top corner. When now moving over that smaller image, then the flicker appears.

该网站上的图像是图库的一部分，因此它是一个php变量，当用户从图像列表中进行选择时会被加载.因此，将一个嵌入另一个非常困难.

The image on the site is part of a gallery, so it's a php variable and gets loaded when a user selects from a list of images. So embedding one into the other is very hard.

推荐答案

因为浏览器正在获取新图像.最好的解决方案是将两个图像合并为一个，或者纯粹使用CSS来更改:hover上的背景位置，或者(对于IE6和非锚元素)使用JS来更改背景位置.

Because the browser is fetching the new image. The best solution is to incorporate both images into one, and either purely use CSS to change the background-position on :hover, or ( for IE6 and non-anchor elements ) change the background position with JS.

这篇关于鼠标悬停元素闪烁的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！