На этом шаге мы рассмотрим методы, применяемые для реализации эффектов проявления и растворения.
Несмотря на то, что анимированные методы .show() и .hide() определенно обладают эффектностью, иногда она может оказаться излишней. К счастью, библиотека jQuery предлагает пару других встроенных и более тонких анимационных эффектов. Например, чтобы обеспечить появление параграфа только за счет плавного увеличения непрозрачности, можно воспользоваться методом .fadeIn('slow'):
$(document).ready(function() {
$('p:eq(1)').hide();
$('a.more').click(function() {
$('p:eq(1)').fadeIn('slow');
$(this).hide();
return false;
});
});
Посмотреть в действии этот эффект можно, воспользовавшись рисунком 1.
Рис.1. Медленное проявление второго абзаца
Полный текст этого примера можно взять здесь.Отличие заключается в том, что эффект, воспроизводимый методом .fadeIn(), начинается с установки нормального размера параграфа, чтобы его содержимое просто постепенно проявлялось в нем. Для плавного уменьшения непрозрачности можно использовать метод .fadeOut().
На следующем шаге мы рассмотрим составные эффекты.