Javascript：鼠标悬停时间间隔为2秒的显示窗口

Question

当鼠标悬停在图像上2秒或更长时间时，我试图显示一个窗口，当然如果用户没有悬停至少2秒钟，我不希望显示窗口。

下面是我使用的代码片段。由于代码现在无论用户在图像上悬停多长时间，窗口都会显示两秒钟。我试图得到类似于Netflix中延迟悬停效果的东西。我确信我错了。所以，提前感谢您的帮助。

<img name="img4" onMouseOver="WindowDelay(this);" onmouseout="closeDetails();" 
        src="images/MyImage.jpg" height="240" width="166"/>

<script language="JavaScript" type="text/javascript">
       var countTime = 0;
       var windowTimer = null

       function WindowDelay(thatImg)
       {
            windowTimer = window.setInterval(function() {countT(thatImg);}, 1000);
       }   

       function countT(thatImg)
       {
            countTime++;

            if (countTime == 2)
            {
                openDetails(thatImg);
                clearInterval(windowTimer);
                countTime = 0;
            }

        }
</script> 

Answer 1

当鼠标移过元素时，使用setTimeout在两秒钟内打开窗口。如果用户将鼠标移出元素，请使用clearTimeout停止将来的窗口打开。