jQuery Animate Nasıl Kullanılır?

jQuery Animate metodu 4 kısımdan oluşmaktadır:

.animate(özellikler(properties), [süre(duration)], [görsellik(easing)], [tamamlandığında yapılacaklar(complete)]);

Özellikler(properties): Animasyon ile değişecek olan CSS özellikleri (renk, genişlik, yükseklik, font boyutu vb.)
Süre (duration): Animasyon süresini belirler. Süre milisaniye cinsinden girilir. 1 Saniye için 1000 yazılır.
Görsellik (easing): Animasyon esnasında hangi görsel fonksiyonun kullanılacağı belirtilir.
Tamamlandığında Yapılacaklar (complete): Animasyon tamamlandığında yapılacak olanlar bir fonksiyon içerisinde belirtilir.

Not: Yukarıda belirtilen tüm kısımlar aynı anda kullanılmak zorunda değildir.

Örnek: Aşağıdaki örnekte butona tıklandığında div’ de bulunan şekil, yazı vb. sağa doğru gitmekte, opaklığı, yüksekliği ve genişliği değişmektedir. Bu örnekte sadece belirtilen div’ in özellikleri değiştirilmiş; süresi veya tamamlandığında yapılacaklar belirtilmemiştir.

$("button").click(function(){ $("div").animate({ left:'250px', opacity:'0.5', height:'150px', width:'150px' }); });