Показать / Скрыть эффект клипа с Fade - PullRequest
Новая
       11

Показать / Скрыть эффект клипа с Fade

2 голосов
/ 15 июня 2011

Нужна помощь в выяснении, как добавить затухание / в к следующему: 

$(function(){               
    $('#menu').stop(true, true).hover(function(){   
            $('.content').stop(true, true).delay(300).show(
                "clip",
                {direction: "vertical"}, 
                200       
            );                          
        },
        function(){ 
            $('.content').stop(true, true).hide( 
                "clip",
                {direction: "vertical"}, 
                200 
            );
        }); 
});

Когда анимация clip происходит при показе / скрытии, я хочу этоодновременно с clip и постепенным исчезновением, но в настоящее время он просто ставится в очередь, если добавить .animate или .fadeIn/Out.

(используя jQuery и jQuery UI )

Пример jsFiddle

Есть идеи?

1 Ответ

4 голосов
/ 15 июня 2011

Вы можете использовать .animate() вместо .fadeIn() / .fadeOut(), ему может быть передана опция (queue : false), которая может запустить анимацию сразу, вместо того, чтобы поместить ее в очередь.

Пример на основе вашего кода (просто установите непрозрачность на ноль по умолчанию): 

$('.content')
    .stop(true, true)
    .show( "clip",{direction: "vertical"}, 800 )
    .animate({ opacity : 1 }, { duration: 800, queue: false });

jsFiddle Demo

...