На этом шаге мы рассмотрим еще один вариант использования метода .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()
Полный текст этого примера можно взять здесь.На следующем шаге мы закончим изучение этого вопроса.
