Метод 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>show text</button>
<p style="display: none">text</p>
javascript$('button').click(function() {
  $('p').show('slow', function() {
    console.log('Animation complete')
  });
});

Смотрите также

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