Page 54 - jQuery для начинающих

А теперь самое сладкое – все эффекты анимации в jQuery крутятся вокруг метода animate.
Данная функция берет один или несколько CSS-свойств элемента и изменяет их от
исходного до заданного за N-ое количество итераций (количество итераций зависит от
указанного времени, но не реже одной итерации в 13мс, если я правильно накопал это
значение). Ну что-же, от слов к делу, попробуем реализовать функции fadeIn и fadeOut с
помощью animate (см. пример animate.html):

// fadeOut()

$('article img').animate({
'opacity':'hide'

})
// fadeIn()
$('article img').animate({
'opacity':'show'

})

Всё просто, давайте-ка теперь усложним задачу – изменим размер блоков и прозрачность:

// значения указанных свойств будут плавно изменяться

// от текущих до заданных
$('article img').animate({
'opacity':0.5,
'height':'50px',

'width':'250px'
})

Как видите – тоже несложно, теперь попробуем отталкиваться от текущих значений, а не

задавать необходимые:

// изменяем, шаг за шагом
$('article img').animate({
'opacity':'-=0.1',

'height':'+=10px'
})

Поигрались и хватит, пора усложнить вам жизнь – у функции animate может быть более

одного параметра, и пора приступить к их разбору. Набор параметров может быть разным,
приведу первый, тот, что попроще:

54

www.trk.kg