0

我想要的是当新图像在鼠标悬停时加载时，它不会移动其上方的任何对象。我已经尝试将它包含在一个 div 中，但由于某种原因我无法让它工作。关于我能做什么的任何帮助或想法？

这是一个页面，其中包含它现在的功能： 单击

这是我的代码：

    <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>
4

1 回答 1

0

这仅仅是因为图像的尺寸不同。最简单的方法是增加 /images/braeden.png 的画布大小并在其顶部添加一个空格，使其与 /images/braeden2.png 的高度完全相同

如果您不想这样做，那么您必须在显示较小的图像时将 padding-top 添加到包含的 div 中，以适应高度差。

于 2013-11-08T00:40:59.943 回答