Jquery добавляет элемент в Div и показывает/скрывает при наведении

Я пытаюсь использовать Jquery, чтобы добавить нижний колонтитул в другой div и отображать недавно добавленный нижний колонтитул при наведении курсора и затем медленно исчезать/скрываться. Это код, который я придумал до сих пор:

<script type="text/javascript">
$('.xg_widget_main .module_forum .vcard').hover(function(){
$(this).append($('.module_forum .xg_module_foot').show('slow'));
});
</script>

Препятствие, с которым я сталкиваюсь в этом коде, заключается в том, что добавленный div не будет подчиняться функции .show('slow') и после того, как мышь будет удалена из области наведения, добавленный div исчезнет не медленно, а мгновенно. Может кто-нибудь любезно посоветовать, что мне здесь не хватает?

Спасибо!


jquery element show-hide hover append
person Allareone    schedule 28.04.2012    source источник
comment
Покажите свой HTML и, если можете, опубликуйте живую демонстрацию, с которой мы можем работать.   -  person David says reinstate Monica    schedule 29.04.2012

Ответы (1)


arrow_upward
1
arrow_downward

Проблема, с которой вы столкнулись сейчас, заключается в том, что результатом .append() является ваш исходный элемент, а не новый, который вы только что добавили. Попробуйте:

  1. изменить смысл вашей append логики
  2. запустите элемент со скрытым:

e.g.

$('.module_forum .xg_module_foot').hide().appendTo(this).show('slow');
person Alnitak    schedule 28.04.2012
comment
Большое спасибо! Я знал, что что-то не получаю. Он работает идеально. Как заставить добавленный div медленно исчезать, используя вашу рекомендацию? - person Allareone; 29.04.2012
comment
Добавленный div не исчезает / исчезает, как я хочу, когда мышь перестает зависать над xg_widget_main .module_forum .vcard, можете ли вы предложить, как я могу это сделать? - person Allareone; 29.04.2012
comment
@Allareone предоставляет второй обратный вызов .hover() с чем-то вроде $('.module_forum .xg_module_foot', this).hide('slow'); - person Alnitak; 29.04.2012