我想要的是当新图像在鼠标悬停时加载时，它不会移动其上方的任何对象。我试过将它包含在一个 div 中，但由于某种原因我无法让它工作。关于我可以做什么的任何帮助或想法？
这是一个包含它现在所做的事情的页面: click
这是我的代码:
<head>
<script type="text/javascript">
function rollover() {
if (!document.getElementById) return
var imgOrSrc;
var imgPreload = new Array();
var images = document.getElementsByTagName('img');
for (var i = 0; i < images.length; i++) {
if (images[i].getAttribute('rsrc')) {
imgPreload[i] = new Image();
imgPreload[i].src = images[i].getAttribute('rsrc');
images[i].onmouseover = function() {
imgOrSrc = this.getAttribute('src');
this.setAttribute('src',this.getAttribute('rsrc'))
}
images[i].onmouseout = function() {
this.setAttribute('src',imgOrSrc)
}
}
}
}
</script>
</head>
<body onLoad="rollover()">
<div id="landimage">
<a href="linkhere"><img src="/images/braeden.png" rsrc="/images/braeden2.png" border="0"></a>
</div>
</body>
最佳答案
这仅仅是因为图像的尺寸不同。最简单的方法是增加/images/braeden.png 的 Canvas 大小，并在其顶部添加一个空格，使其高度与/images/braeden2.png 完全相同
如果您不想这样做，则必须在显示较小图像时向包含的 div 添加 padding-top，以适应高度差异。
关于javascript - 如何在没有新图像移动对象的情况下包含鼠标悬停图像链接？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19849566/