jQuery 1.4.2悬停方法:鼠标悬停并将鼠标移出问题
问题描述:
我有以下代码来显示帖子的段落,鼠标悬停在H1标签之后,但我想防止鼠标通过时显示段落对H1标签的抨击(他们在一个页面上有几个),因此用户必须在H1标签上停留一段时间才能显示de post段落。另一方面,如果用户推出H1但翻过P标签,则该段落不会切换。jQuery 1.4.2悬停方法:鼠标悬停并将鼠标移出问题
这是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");
});
如果有人知道一个解决方案,我非常感激。
答
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
以上时,您的帖子不会消失。
它不切换段落显示。 – betacar 2010-04-13 18:28:37