Методы анимации

Метод	Описание
show([speed[, callback]])	Показывает элемент
hide([speed[, callback]])	Скрывает элемент
fadeIn(speed[, callback])	Показывает элемент, путем изменения его прозрачности
fadeOut(speed[, callback])	Скрывает элемент, путем изменения его прозрачности
slideDown(speed, callback)	Показывает элемент, спустив его сверху
slideUp(speed, callback)	Показывает элемент, подняв его снизу

Примечание: speed – время в миллисекундах, за которое произойдет определенная анимация, callback – функция, которая вызовется по окончанию анимации. Также все эти методы можно вызывать при помощи метода animate

Пример:

for(var i = 0; i < 10; i++)

{

$("#div1").hide(300);

$("#div1").show(300);

$("#div2").animate({height: "show"}, 300);

$("#div2").animate({height: "hide"}, 300);

//Получаем плавное мерцание двух элементов div

}

Метод animate позволяет создавать различные эффекты, многие из которых реализованы в различных библиотеках.

События

При работе с визуальным интерфейсом пользователя невозможно избежать использования событий, таких как нажатие какой-либо кнопки или выделения поля ввода. jQuery поддерживает целый ряд событий, некоторые из которых перечислены в следующей таблице.

Метод	Описание
click	Одинарный щелчок по элементу
focus	Выделение элемента
blur	Снятие выделения с элемента
keypress	Нажатие клавиши на клавиатуре
load	Загрузка элемента
mousemove	Движение курсора мыши

Пример:

$(function()

{

$("input").live("keypress", function(e)

{

if(e.keyCode == 13)

{

alert("Нажата клавиша Enter");

}

});

$("button").bind("click", function()

{

alert("Нажата кнопка");

});

});

Примечание: Добавление событий к элементам осуществляется посредством двух методов live и bind. Их отличие состоит в том, что первый может привязать событие к еще несуществующему элементу.

В заключении

jQuery развивающаяся в наше время библиотека для работы с элементами DOM-структуры. Она значительно дополняет Javascript и постепенно переходит из простой библиотеки-надстройки в библиотеку-фрейворк. Она может быть расширена и дополнена любыми методами, которые понадобятся программисту при решении каких-либо задач, связанных с разработкой динамических веб-приложений. В данной статье охвачены далеко не все возможности jQuery и Javascript, потому что, во-первых jQuery постоянно развивается и совершенствуется, во-вторых ее возможности действительно огромны.

Полезные ссылки

http://javascript.ru – все о языке в примерах и с описанием

http://jquery.ru – новые версии библиотеки, справочник по API

http://jqueryui.ru – дополнительные библиотеки для работы с визуальным интерфейсом пользователя