jQuery animate() Metodu nasıl kullanılır?

jquery kod yazan ve sitelerinde hareketli birşeyler olmasını istiyen arkadaşları ilgilendiren bir konu animate methodu sayesinde güzel efektler ile süsleyip birçok yerde kullanabilirsiniz Kullanımı çok basit mantığını kavradığınızda ise nekadar derin bir konu olduğunu anlıyacaksınız sadece slider olarak düşünmeyin animate methodunu birçok yerde kullanabilirsiniz şimdi örneklerle basit bir şekilde anlatmaya çalışacağım umarım sizlere faydalı olur.

	 Değişecekdeğiştir$('button').click(function(){ $(".degisecek").animate({"width":"200px","height":"200px"}, 1000);

En basit hali bu bir buton ile varolan bir divimizi secip genişlik ve yükseklik değerlerini değiştirdik yukarıdaki işlemde olay aslında çok basit jquery ile nesnemizi seciyoruz ve hemen ardından .animate() ile methodumuzu çağırıyoruz. Jquery animate methodunun kendine özel parametleri var bu paremetreler ile efekt,yapacağımız işlem,kaç saniyede gelişeceği gibi eksra özellikleri bulunmakta şimdi biz yukarıdaki işlemde 2 tane parametre kullandık ilk önce yapılmasını istediğimiz işlemi,sonrasında ise 1 saniyede işlemin gerçekleşmesini istedik. Parametleri kullanırken {} işaretleri arasında virgül ile ayırarak kullanıyoruz şimdi bütün parametrelerini görelim

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

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

Özellikler: Animasyon ile değişecek olan CSS özellikleri (renk, genişlik, yükseklik, font boyutu v.b.)
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.

 

Görüş Hata Bildir

Güvenlik Kodunuz:

Yorum Yap

Yorum kodunuz:

0.0367