Question

我想知道如何使用javascript打开一个隐藏的div，但是在用户将链接悬停一秒而不是立即之后。我想这样做，因为现在你在页面上扫过鼠标，这些div打开了，即使我没有故意在它们上面盘旋。我不想要使用jQuery

这是我的代码：

function ShowMemberCats()
{
     // TURN OFF OTHER FRAMES //
     document.getElementById('BlogCats').style.display = 'none';
     document.getElementById('VideoCats').style.display = 'none';
     document.getElementById('AudioCats').style.display = 'none';
     document.getElementById('ImageCats').style.display = 'none';
     document.getElementById('CouponCats').style.display = 'none';
     document.getElementById('AdsCats').style.display = 'none';
     // OPEN VIDEO FRAME //
     document.getElementById('MemberCats').style.display = '';
}

任何帮助将不胜感激..

非常感谢，保罗

Answer 1

当光标位于链接（onmouseover）上时，启动计时器（setTimeout）。
如果此计时器达到1秒，则显示您的div 如果光标离开链接（onmouseout），请取消您的计时器（clearTimeout）。

Answer 2

这个概念很好地显示here。它不完全相同，也不那么优雅，但它显示了你想要实现的原则。

<script type="text/javascript">

  var ie = document.all;
  var timeoutId;
  var timeoutObj;

  document.onmouseover = function(e) {
    var obj = ie ? event.srcElement : e.target;
    if (obj.className=='testblock') {
      timeoutObj = obj;
      timeoutId = setTimeout("delay()", 2000);
    }
  }

  document.onmouseout = function(e) {
    var obj = ie ? event.srcElement : e.target;
    if ((obj.className=='testblock') && timeoutId )
      clearTimeout(timeoutId);
  }

  function delay() {
    document.getElementById('output').innerHTML = timeoutObj.style.backgroundColor;
  }

</script>

暂停打开div onmouseover

2 个答案: