slideUp metodu

slideUp metodu elementləri rəvan şəkildə aşağıdan yuxarıya doğru yığaraq gizlədir. Elementləri göstərmək üçün slideDown metodundan istifadə edə bilərsiniz.

Sintaksis

Müəyyən edilmiş müddət ərzində gizlətmə, 400ms standart olaraq:

javascript.slideUp(muddet);

Vaxtı təkcə millisaniyələrlə deyil, həm də açar sözlərlə slow (600ms) və fast (200ms) ilə də təyin etmək olar, qiymət nə qədər böyükdürsə, animasiya bir o qədər yavaş olar:

javascript.slideUp('slow' ya da 'fast');

Əgər parametrlər göstərilməzsə - animasiya olmayacaq, elementlər ani şəkildə gizlədiləcək:

javascript.slideUp();

Həmçinin ikinci parametr kimi rəvanlıq funksiyası, üçüncü parametr kimi isə callback funksiyası - animasiya bitdikdən sonra işləyəcək - ötürülə bilər. Hər iki parametr isteğe bağlıdır:

javascript.slideUp(muddet, [revanliq funksiyasi], [callback funksiyasi]);

Metoda müxtəlif opsiyalar, JavaScript obyekti şəklində, içində açar: qiymet cütləri olan şəkildə ötürülə bilər:

javascript.slideUp(opsiyalar);

Belə bir obyekt aşağıdakı parametrləri və funksiyaları ötürə bilər - duration, easing, queue, specialEasing, step, progress, complete, start, done, fail, always. Bu parametrlərin təsvirini animate metodu üçün baxa bilərsiniz. Məsələn, müddəti və rəvanlıq funksiyasını təyin edək:

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

Nümunə

Gəlin düyməyə basdıqdan sonra, slideUp metodu ilə input və düyməni ehtiva edən valideyn div-i rəvan şəkildə gizlədək (bu div-i parent metodu ilə tapacağıq). slow açar sözünü ötürməklə, sürəti 600ms olaraq təyin edəcəyik. #test ilə div-də 'Text is hidden' yazısını çıxardacağıq:

html<div>
  <button>hide text</button>
  <input type="text" value="aaa">
</div>
<div id="test"></div>
javascript$('button').click(function() {
  $(this).parent().slideUp('slow', function() {
    $('#test').text('Text is hidden');
  });
});

Həmçinin bax

  • slideDown metodu,
    elementləri rəvan şəkildə göstərir
  • slideToggle metodu,
    elementlərin rəvan göstərilməsi/gizlənməsini növbələşdirir
  • fadeOut metodu,
    elementləri şəffaf edərək rəvan şəkildə gizlədir
  • hide metodu,
    elementləri rəvan şəkildə gizlədir