jQuery 1.4.2悬停方法:鼠标悬停和鼠标悬停问题

时间:2010-04-13 18:06:07

标签: jquery events

在鼠标悬停在H1标签上之后,我有以下代码显示帖子的段落,但是如果鼠标在H1标签上通过ramdomly(我们在一页中有多个),我想阻止显示段落,因此用户必须在H1标签上停留一段时间才能显示de post段落。另一方面,如果用户推出H1但超过P标签,则段落不会切换。

这是我现在写的jQuery代码:

    $("div#postContainer p").hide(); //By default, we hide the post paragraph
    $("div#postContainer h1").hover(function() {
        $(this).removeClass("less").addClass("more");
        $(this).next("p").animate({opacity:"show",height:"toggle"}, "slow");
    }, function() {
        $("div#postContainer h1 span").removeClass("more").addClass("less");
        $(this).next("p").animate({opacity:"hide",height:"toggle"}, "normal");
    });

如果有人知道解决方案,我非常感激。

1 个答案:

答案 0 :(得分:0)

window.setTimeout()window.clearTimeout())就是您所需要的。

var myInterval;

$("...").hover(function() {
   myInterval = window.setTimeout(function() {
      // display
   }, 500);
}, function() {
   window.clearInterval(myInterval);
   // hide if visible
});

另外,将.hover附加到div#postContainer,而不是div#postContainer h1。将鼠标移到p上时,您的帖子不会消失。