|
|
Синтаксис и описание:
Добавлено в jQuery 1.0.fadeOut( [ duration ] [, complete ] )
Добавлено в jQuery 1.0.fadeOut( options )
Добавлено в jQuery 1.4.3.fadeOut( duration [, easing ] [, complete ] )
Команда .fadeOut(), парная к .fadeIn(), плавно уменьшает непрозрачность элементов набора jQuery до 0. Как только непрозрачность достигает нуля, jQuery устанавливает элементу display: none — он перестаёт занимать место в layout, как и после .hide().
Параметры:
duration – (число | строка) Продолжительность в миллисекундах либо "fast" (200 мс) / "slow" (600 мс). По умолчанию — 400 мс.
easing – (строка, с jQuery 1.4.3) swing (по умолчанию) или linear.
complete – (функция) Вызывается по одному разу на каждый элемент после того, как он полностью скрыт.
options – (объект) Хэш параметров эффекта — как у .fadeIn() и .animate().
Примечание: Пока анимация не завершена, элемент помечается селектором :animated — это можно использовать, чтобы не запускать повторную анимацию поверх уже идущей.
Примечание: После .fadeOut() элемент получает display: none и попадает под селектор :hidden — так же, как после .hide(). Анимированное значение opacity по завершении jQuery возвращает к исходному, так что последующий .show() сразу покажет элемент полностью непрозрачным.
В jQuery 3.x и 4.0: Метод не деприкейчен. Как и у .fadeIn(), в slim-сборке jQuery эффектов нет (с 3.0), а с 4.0 в slim дополнительно недоступны deferred/queue — для .fadeOut() в любом виде нужна полная сборка.
Примеры:
Скрыть уведомление плавно и удалить его из DOM после завершения.
$('#toast').fadeOut(400, function() {
$(this).remove();
});
Не запускать повторно, пока идёт анимация (через :animated).
$('#panel').on('click', '.js-close', function() {
var $panel = $('#panel');
if (!$panel.is(':animated')) {
$panel.fadeOut(300);
}
});
[ наверх ]
|
|