Метод show

Методът show плавно показва скрити елементи. Да скриеш елементи можеш с помощта на метода hide.

Синтаксис

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

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

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

javascript.show('slow' или 'fast');

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

javascript.show();

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

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

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

javascript.show(options);

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

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

Пример

Нека след натискане на бутон, плавно да показваме скрит параграф с помощта на метода show. Като подадем ключовата дума slow, ще зададем скорост от 600мс. След приключване на анимацията ще изведем в конзолата 'Анимацията завърши':

html<button>покажи текст</button>
<p style="display: none">текст</p>
javascript$('button').click(function() {
  $('p').show('slow', function() {
    console.log('Animation complete')
  });
});

Вижте също

  • метод hide,
    който плавно скрива елементи
  • метод slideDown,
    който плавно показва елементи
  • метод fadeIn,
    който плавно показва скрити елементи, правейки ги непрозрачни