Метод slideUp

Методът slideUp плавно скрива елементи, като ги свива от долу нагоре. Показването на елементи може да се извърши с помощта на метода slideDown.

Синтаксис

Скриване за зададено време, 400мс по подразбиране:

.slideUp(продължителност);

Времето може да се задава не само в милисекунди, но и с ключови думи slow (600мс) и fast (200мс), колкото по-голяма е стойността, толкова по-бавна е анимацията:

.slideUp('slow' или 'fast');

Ако не се указват параметри - анимация няма да има, елементите ще се скриват мигновено:

.slideUp();

Може също така като втори параметър да се подаде функция за изглаждане, както и като трети callback функция - ще се задейства след изпълнение на анимацията. И двата параметъра не са задължителни:

.slideUp(продължителност, [функция за изглаждане], [callback функция]);

На метода могат да се подадат различни опции, под формата на JavaScript обект, съдържащ двойки ключ: стойност:

.slideUp(options);

Такъв обект може да предава следните параметри и функции - duration, easing, queue, specialEasing, step, progress, complete, start, done, fail, always. Описание на тези параметри можете да видите за метода animate. Например, нека зададем продължителност и функция за изглаждане:

.slideUp( {duration: 800, easing: easeInSine} );

Пример

Нека след натискане на бутона, плавно скрием родителския div, който съдържа input и бутон, с помощта на метода slideUp (този div ще намерим с помощта на метода parent). Като подадем ключовата дума slow, ще зададем скорост от 600мс. В div с #test ще изведем надпис 'Text is hidden':

<div>
	<button>hide text</button>
	<input type="text" value="aaa">
</div>
<div id="test"></div>

$('button').click(function() {
	$(this).parent().slideUp('slow', function() {
		$('#test').text('Text is hidden');
	});
});

Вижте също

метод slideDown,
който плавно показва елементи
метод slideToggle,
който редува плавно показване/скриване на елементи
метод fadeOut,
който плавно скрива елементи, правейки ги прозрачни
метод hide,
който плавно скрива елементи