Несколько всплывающих эффектов одновременно для выпадающего меню - PullRequest
Новая
       30

Несколько всплывающих эффектов одновременно для выпадающего меню

0 голосов
/ 05 февраля 2012

Я хотел бы показать мышь подменю над:

  1. fadein (непрозрачность: 0 -> непрозрачность: 1) эффект и
  2. перемещение позиции (позиция: абсолютная; верх: 20px -> top: 50px) одновременно, как это: http://www.tuttoaster.com/wp-content/uploads/demos/3/navigation.html

Но без «slideUp» и «slideDown».Вся коробка должна двигаться.Например, http://panic.com/coda/ эффект при наведении курсора на всплывающую подсказку «Скачать».

jQuery: 

$(function(){

$('.sub-menu li').hover(
   function(){

$('ul', this).stop().animate({opacity: '1', top: '50px'}, 800);
},
function() {
$('ul', this).stop().animate({opacity : '0', top: '20px'}, 300);
});
});

Мой код активации отображается на jsfiddle http://jsfiddle.net/C4c46/1/

Спасибо

1 Ответ

0 голосов
/ 06 февраля 2012

Это решение прекрасно работает для меня:

В действии http://jsbin.com/iquwuc/6/edit#preview

$(document).ready(function(){
$('.sub-menu li#access ul').hide();
    $('.sub-menu li#access').hover(function(){
        $('.sub-menu li#access ul').stop().animate({opacity: "show", marginTop: "25"}, 500);
        },
        function() {
        $('.sub-menu li ul').stop().animate({opacity: "hide", marginTop: "10"}, 500);
        });
});
...