Jquery停止淡入/淡出
这是一个相当简单的问题，但我似乎无法弄清楚.
This is a fairly easy one, but I cant seem to figure it out.
基本上，我有一个 jquery 悬停，它在一个 div 中淡入并在悬停时淡出另一个.
Basically I have a jquery hover that fades in a div and fades out the other upon hover.
当我快速打开和关闭几次时，它会来回跳动大约 3-4 秒以完成所有淡入/淡出.
When I quickly hover on and off a few times it pulses back and forth for about 3-4 seconds to finish all those fade in/fade outs.
我通常用 .stop() 来停止这些事情，但它似乎在这里不起作用.如果我将鼠标悬停在 an`$(".txtWrap").stop().hover(
I generally stop these things with .stop(), but it doesnt seem to do the trick here. How can I kill the fade in if I hover off the button before the an`$(".txtWrap").stop().hover(
$(".txtWrap").stop().hover(
function () {
$(this).find('.txtBock').fadeOut();
$(this).find('.txtDesc').fadeIn();
},
function () {
$(this).find('.txtBock').fadeIn();
$(this).find('.txtDesc').fadeOut();
}
)
推荐答案
你的 stop() 放错地方了.
试试这个:
$(".txtWrap").hover(
function () {
$(this).find('.txtBock').stop().fadeOut();
$(this).find('.txtDesc').fadeIn();
// $('#timeTxt').fadeOut();
// $('#timeTxtDesc').fadeIn();
},
function () {
$(this).find('.txtBock').fadeIn();
$(this).find('.txtDesc').stop().fadeOut();
}
)
<小时>
这将在不隐藏元素的情况下为元素的不透明度设置动画.如果你想隐藏它们，使用 .hide() 你需要添加一个回调到 animate 函数.
This will animate the elements' opacity without hiding the element. If you want them hidden, use .hide() you'll need to add a callback to the animate function.
$(".txtWrap").hover(
function () {
$(this).find('.txtBock').stop().animate({opacity:0}, 500);
$(this).find('.txtDesc').animate({opacity:1}, 500);
// $('#timeTxt').fadeOut();
// $('#timeTxtDesc').fadeIn();
},
function () {
$(this).find('.txtBock').animate({opacity:1}, 500);
$(this).find('.txtDesc').stop().animate({opacity:0}, 500);
}
)
相关文章