Question

我有2张图片，一张大图片，一张图片。大的是77 X 15，小的是15 X 15.

现在这两幅图像位于另一幅图像的顶部（尺寸可能不同）。应该发生的是;当用户将鼠标悬停在小图像上时，它将被隐藏，然后显示大图像。两个图像都包含在DIV中。我知道我可以在一个函数中执行此操作（并且我已经使它工作）但我需要尝试将其保持内联（我知道的是犯罪）。这是我到目前为止的代码。请记住，我被传递了这段代码。

<div id="small" style="position:absolute;top:0px;right:15px; z-index:5000;" onmouseover="this.style.visibility='hidden';" onmouseout="this.style.visibility='visible';">

<img src="small.gif" style="FILTER:Alpha(Opacity=50, FinishOpacity=50, style=0); position:absolute; width: 15px; height: 15px;" border="0" alt="text">

</div>

<div id="large" style="position:absolute;top:0px;right:77px; z-index:5000;" onmouseover="this.style.visibility='visible';" onmouseout="this.style.visibility='hidden';"><img src="large.gif" style="position:absolute" border="0" alt="text">

</div>

似乎发生的事情是，当我将鼠标悬停在较大的图像上时，它会消失，然后当你将鼠标悬停在它上面时，小的图像会一直闪烁。有任何想法吗？

编辑：忘记提及两个图像都不同，所以我不能只调整一个图像的大小。

我可能接近这个完全错误，所以请让我知道。

由于

Answer 1

我不认为这是一个非常好的方法，考虑在单个图像上使用一个简单的jquery动画。在mouseOver上增加高度或其他什么，并在mouseout上再次减少它!!

图像交换在JavaScript中无法正常运行

1 个答案: