На этом шаге мы рассмотрим еще один вариант использования метода .animate().
Кроме свойств стиля, для управления которыми имеются сокращенные формы методов, мы можем управлять и другими свойствами, такими как: left, top, fontSize, margin, padding и borderWidth. Вернемся к сценарию, который увеличивает размер шрифта текста романа. Мы можем анимировать увеличение и уменьшение размера шрифта простой заменой метода .css() методом .animate():
$(document).ready(function() { var $speech = $('div.speech'); var defaultSize = $speech.css('fontSize'); $('#switcher button').click(function() { var num = parseFloat( $speech.css('fontSize'), 10 ); switch (this.id) { case 'switcher-large': num *= 1.4; break; case 'switcher-small': num /= 1.4; break; default: num = parseFloat(defaultSize, 10); } $speech.animate({fontSize: num + 'px'}, 'slow'); }); });
Рис.1. Изменение размера шрифта методом .animate()
Полный текст этого примера можно взять здесь.На следующем шаге мы закончим изучение этого вопроса.