php - 设置鼠标悬停时图像需要更改的时间

Question

我想在 JavaScript 中设置鼠标悬停功能的时间。

我的代码如下。

<img class="product-image" 
  src='<?php echo $item['0']; ?>' 
  onmouseover="this.src='<?php echo $item2['0']; ?>'" 
  onmouseout="this.src='<?php echo $item['0']; ?>'" />.

此代码工作正常，但我想设置图像在鼠标悬停事件上替换的时间。

Answer 1

t您可以创建此 JavaScript 函数以仅在毫秒后更改图像。

function delayedImage(obj, src, t)
{
  setTimeout(function() {
    obj.src = src;
  }, t);
}

然后使用这个 HTML：

<img class="product-image" 
  src='<?php echo $item['0']; ?>' 
  onmouseover="delayedImage(this, '<?php echo $item2['0']; ?>', 2000)" 
  onmouseout="delayedImage(this, '<?php echo $item['0']; ?>', 2000)" />

也许你不需要它mouseout，但这很容易改变:)