попытка исчезновения верхнего div при наведении, чтобы показать рабочие ссылки в тексте ниже, используя JQuery - PullRequest
0 голосов
/ 04 мая 2010

Мне нужно исчезнуть div (и изображение), чтобы показать div внизу (текст с интерактивными ссылками), используя jQuery.

<script>
$(document).ready(function(){
$("img.a").hover(
function() {
$(this).stop().animate({"opacity": "0"}, "slow");
},
function() {
$(this).stop().animate({"opacity": "1"}, "slow");
});

});
</script>

Использовал приведенный выше код и все работало хорошо, пока я не пошел по ссылкам. Кажется, верхний скрытый div мешает мне сделать это.

Попробовал функцию replaceWith, и это позволило мне тоже щелкать ссылки - но не смог заставить его вернуться к отображению оригинального div, когда я отключил звук Кроме того, начальник хочет, чтобы переход был постепенным - как исчезновение ...

Есть предложения?

Большое спасибо!

Хит

1 Ответ

0 голосов
/ 06 мая 2010

Хорошо - оба следующих варианта работают достаточно хорошо в большинстве браузеров, но в IE, когда я даже слегка двигаю мышь, div начинает исчезать и исчезать, а также может создавать очередь или цикл исчезновения / исчезающие события:

$(document).ready(function () {
    $("#goingimg").hover(
        function () { $(".going").fadeOut("normal",0); }, 
        function () { $(".going").fadeTo("normal",1); }
    );       
});

$(document).ready(function () {
    $("#goingimg").hoverIntent(function() {
        $(".gone").fadeOut("normal",0);
        $('#goingimg').hoverIntent(function(event) { event.stopPropagation(); });
    }, function() {
        $(".gone").fadeTo("normal",1);
        $('#goingimg').hoverIntent(function(event) { event.stopPropagation(); });
    });
});

Я попробовал предложенный плагин hoverIntent и функцию event.stopPropagation. Тем не менее, в IE - все просто не по себе. Есть ли способ обойти это, что кто-нибудь знает?

Большое спасибо ...

...