使用Javascript向鼠标悬停添加延迟

我对所有图像鼠标盖使用以下脚本：

loadImage1 = new Image();
loadImage1.src="1.jpg";
staticImage1 = new Image();
staticImage1.src="1-roll,jpg";

我怎么能简单地添加，比如说，在它执行鼠标悬停之前加上一两秒钟的延迟呢

提前感谢您的帮助

---更新---

谢谢你的回复。请原谅我对Javascript的无知。如何在下面的脚本中包含超时片段

<SCRIPT LANGUAGE="JavaScript">
loadImage1 = new Image();
loadImage1.src="/wp-content/themes/Anna%20Rawson/images/1-blog.jpg";
staticImage1 = new Image();
staticImage1.src="/wp-content/themes/Anna%20Rawson/images/1-blog.jpg";
</script>

loadImage1=新图像（）；
loadImage1.src=“/wp content/themes/Anna%20Rawson/images/1-blog.jpg”；
staticImage1=新图像（）；
staticImage1.src=“/wp content/themes/Anna%20Rawson/images/1-blog.jpg”；

我是否将超时片段包装在它自己的脚本标记中？谢谢你的快速帮助

您可以使用以下示例：

var img1 = document.getElementById('my-img');
img1.onmouseover = function() {
  setTimeout(function() {
    this.src = 'my-img-2.png';
  }, 1000); // 1000ms = 1s delay
};

---

首先，您的代码有一些错误：

• 始终使用小写字母编写HTML标记，而不是
  ，而是

• langauge

  属性不是有效的属性，请改为使用

  type=“text/javascript”

  ，或者将其删除，这不是必需的

图像对象并不是真的在网站上制作图像。它预加载图像，因此您可以在网站上使用它，而无需加载图像。像这个例子：

<img src="/img/my-first-img.png" onmouseover="this.src = '/img/heavy-img.png'">
<script>
  var heavyImg = new Image();
  heavyImg.src = '/img/heavy-img.png'; // preload the img
</script>

---

谢谢我更新了帖子，并回答了问题。你能帮我把代码拼出来吗？非常感谢！

<img src="/img/my-first-img.png" id="my-img">
<script>
  var heavyImg = new Image();
  heavyImg.src = '/img/heavy-img.png'; // preload the img

  var myImg = document.getElementById('my-img'); // get the element with id="my-img" out of the DOM

  // create a mouseover event
  myImg.onmouseover = function() {
    setTimeout(function() {
      this.src = '/img/heavy-img.png' // load the img
    }, 1000); // a delay of 1000ms = 1s
  };
</script>