эффекты jquery
Метод animate является основой большинства, если не всех, эффектов jQuery и плагинов. Например, jQuery предлагает следующие методы для показа и скрытия элементов:
* show([speed[, callback]]) – показать элемент;
* hide([speed[, callback]]) – скрыть элемент;
* fadeIn(speed[, callback]) – показать элемент путем изменения его прозрачности;
* fadeOut(speed[, callback]) – скрыть элемент путем изменения его прозрачности;
* slideDown(speed, callback) – показать элемент, спустив его сверху;
* slideUp(speed, callback) – показать элемент, подняв его снизу;
где
speed – скорость в миллисекундах или одно из "slow" (600 миллисекунд) или "fast" (200 миллисекунд);
callback – функция, которая будет вызвана после выполнения анимации.
Рассмотрим, например, реализацию функции show:
show: function(speed,callback){
// находим в переданной нам коллекции скрытые элементы (см. врезку)
var hidden = this.filter(":hidden");
// если нам передана скорость, то вызываем метод animate
if(speed)
{
hidden.animate(
{
height: "show",
width: "show",
opacity: "show"
},
speed,
callback
)
}
else
{
// иначе просто проходим по коллекции элементов и показываем их,
// меняя стиль display с none на block
hidden.each(
function()
{
this.style.display = this.oldblock ? this.oldblock : "";
if ( jQuery.css(this,"display") == "none" )
this.style.display = "block";
}
);
}
return this;
}
Скрытая мощь функции animate позволяет создавать поистине удивительные эффекты.
Необходимо также заметить, что все эффекты библиотеки jQuery применяются к элементам не сразу, а по очереди. То есть, предположим, что мы написали такой код:
for(i = 0; i < 10; i++)
{
$("#my-div").animate({height: "show"}, 300);
$("#my-div").animate({height: "hide"}, 300);
}
В результате мы получим не беспорядочное моргание, пока двадцать эффектов борются за право показать/скрыть элемент «my-div», а плавный показ, потом сокрытие, потом снова показ – и так 20 раз. Обратите внимание, что очередь эффектов составляется поэлементно. То есть эффекты, примененные к разным элементам одновременно, будут выполняться одновременно.