JQuery .fadeIn () выравнивается при скрытии и повторном показе элемента - PullRequest
0 голосов
/ 24 ноября 2010

Итак, я проектирую веб-сайт (используя 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> исчезает и очищается.

Однако, если указатель не находится над изображением в течение полного времени нарастания, максимальная непрозрачность элемента spacer div, по-видимому, уменьшается до тех пор, пока наведение мыши не создаст никакого эффекта.

Я был бы очень признателен, если бы кто-нибудь, кто знает больше JQuery, чем я, мог бы пролить свет на эту тему; Я предполагаю, что это основная проблема (я никогда не использовал JQuery до этого проекта).

Заранее спасибо.

1 Ответ

1 голос
/ 24 ноября 2010

Я принял вызов .stop(), и, кажется, он работает нормально, но я все еще пытаюсь разобрать все, что происходит.

http://jsfiddle.net/f3EJ3/

...