如何使onmouseover图像尺寸相对于onmouseout img？

Question

我目前正在使用onmouseover和onmouseout在鼠标悬停时显示不同的图像。

onmouseover图像与onmouseout图像具有不同的尺寸，因此当将鼠标悬停在图像上时，页面布局就会改变。

这是我当前拥有的代码的示例：

<img src="images/image.png" onmouseover="this.src='images/image2.png';" onmouseout="this.src='images/image.png';">

是否可以将onmouseover图像设置为与onmouseout图像的宽度一致，从而不更改页面布局？

（我对此很陌生，请多多包涵）

Answer 1

最简单的方法是首先找到您的主要image width和height尺寸

我的主图像width是750px，高度是500px

因此，您只需要为style标签设置width and height的{​​{1}}属性

它将为所有图像（包括img和width的所有图像设置height和onmouseover，所有三个图像都将以相同的维度显示

onmouseout