Question

所以我正在设计一个网站（使用WordPress），我想在另一个元素被鼠标悬停时使用JQuery隐藏/显示某个元素。 HTML看起来大致像这样

<div class="post" style="clear:both;">
    <a href="...">
        <img  src="..." />
    </a>
    <div class="autohide">
        <h3>
            <a href="...">...</a>
        </h3>
        <p>....</p>
    </div>
 </div>
 ...
 <div class="spacer" />

，JQuery看起来像这样：

jQuery(document).ready(function(){
    jQuery(".post .autohide").hide();`
    jQuery(".post").hover(function() {
        jQuery(this).nextAll(".spacer").first().stop().html(jQuery(this).children(".autohide")
            .html()).fadeIn();
    },function() {
        jQuery(this).nextAll(".spacer").stop().show().fadeOut().html("").hide();
    });
});

应该发生的是，当用户将鼠标悬停在图像上时，相关的自动隐藏<div>的内容将被移植到下一个间隔<div>中，然后逐渐消失;当他们鼠标移出时，自动隐藏<div>淡出并清除。

但是，如果指针未在整个淡入时间的图像上方，则间隔div的最大不透明度似乎会降低，直到鼠标悬停根本不会产生任何效果。

如果知道更多JQuery的人比我能说明这个话题，我将非常感激。我认为这是一个基本问题（我在这个项目之前从未使用过JQuery）。

提前致谢。

Answer 1

我接听了.stop()个来电，似乎工作正常，但我仍在尝试解析正在发生的一切。

http://jsfiddle.net/f3EJ3/

隐藏和显示元素时，JQuery .fadeIn（）会关闭

1 个答案: