jQuery Etkileri - Solukla Soluklaşma

jQuery ile, elementlerin solukla soluklaşma ve soluklaşma etkilerini gerçekleştirebilirsiniz.

Etki Gösterimi

Buraya tıklayarak paneli gizle/göster

Bir zaman bir altın, bu yüzden, size hızlı ve anlaşılır öğrenim içerikleri sunuyoruz.

Burada, ihtiyacınız olan herhangi bir bilgiyi anlaşılır ve kolay bir şekilde elde edebilirsiniz.

Örnek

jQuery fadeIn()
jQuery fadeIn() yöntemini gösterin.
jQuery fadeOut()
jQuery fadeOut() yöntemini gösterin.
jQuery fadeToggle()
jQuery fadeToggle() yöntemini gösterin.
jQuery fadeTo()
jQuery fadeTo() yöntemini gösterin.

jQuery Fading Yöntemleri

jQuery ile, elementlerin solukla soluklaşma ve soluklaşma etkilerini gerçekleştirebilirsiniz.

jQuery, aşağıdaki dört fade yöntemine sahiptir:

  • fadeIn()
  • fadeOut()
  • fadeToggle()
  • fadeTo()

jQuery fadeIn() yöntemi

jQuery fadeIn() yöntemi, gizlenmiş elementleri solukla gösterir.

Gramer:

$(selektor).fadeIn(speed,callback);

Opsiyonel speed Parametre, etkili süresini belirler. Aşağıdaki değerleri alabilir: "slow", "fast" veya milisaniye.

Opsiyonel callback Parametre, solma-ışınma tamamlanması sonrasında çalıştırılacak olan fonksiyonun adıdır.

Aşağıdaki örnek, farklı parametrelerle fadeIn() yöntemini gösterir:

Örnek

$("button").click(function(){
  $("#div1").fadeIn();
  $("#div2").fadeIn("slow");
  $("#div3").fadeIn(3000);
});

Kişisel olarak deneyin

jQuery fadeOut() yöntemi

jQuery fadeOut() yöntemi, görünür elementleri solukla çıkarır.

Gramer:

$(selektor.fadeOut(speed,callback);

Opsiyonel speed Parametre, etkili süresini belirler. Aşağıdaki değerleri alabilir: "slow", "fast" veya milisaniye.

Opsiyonel callback Parametre, solma-ışınma tamamlanması sonrasında çalıştırılacak olan fonksiyonun adıdır.

Aşağıdaki örnek, farklı parametrelerle fadeOut() yöntemini gösterir:

Örnek

$("button").click(function(){
  $("#div1").fadeOut();
  $("#div2").fadeOut("slow");
  $("#div3").fadeOut(3000);
});

Kişisel olarak deneyin

jQuery fadeToggle() yöntemi

jQuery fadeToggle() yöntemi, fadeIn() ve fadeOut() yöntemleri arasında geçiş yapabilir.

Eğer element zaten solmuşsa, fadeToggle() elemente ışınma etkisi ekler.

Eğer element zaten solmuştaysa, fadeToggle() elemente solma etkisi ekler.

Gramer:

$(selektor).fadeToggle(speed,callback);

Opsiyonel speed Parametre, etkili süresini belirler. Aşağıdaki değerleri alabilir: "slow", "fast" veya milisaniye.

Opsiyonel callback Parametre, solma-ışınma tamamlanması sonrasında çalıştırılacak olan fonksiyonun adıdır.

Aşağıdaki örnek, farklı parametrelerle fadeToggle() yöntemini gösterir:

Örnek

$("button").click(function(){
  $("#div1").fadeToggle();
  $("#div2").fadeToggle("slow");
  $("#div3").fadeToggle(3000);
});

Kişisel olarak deneyin

jQuery fadeTo() yöntemi

jQuery fadeTo() yöntemi, belirtilen şeffaflık düzeyine (0 ile 1 arasında değerler) yavaşça geçiş yapma yeteneğine sahiptir.

Gramer:

$(selektor).fadeTo(speed,opacity,callback);

Zorunlu speed parameri, etkili süresini belirler. Aşağıdaki değerleri alabilir: "slow", "fast" veya milisaniye.

fadeTo() yönteminde zorunlu opacity parameri, solma-ışınma etkisini belirtilen şeffaflık düzeyine (0 ile 1 arasında değerler) ayarlar.

Opsiyonel callback parameri, fonksiyonun tamamlanması sonrasında çalıştırılacak olan fonksiyonun adıdır.

Aşağıdaki örnek, farklı parametrelerle fadeTo() yöntemini gösterir:

Örnek

$("button").click(function(){
  $("#div1").fadeTo("slow",0.15);
  $("#div2").fadeTo("slow",0.4);
  $("#div3").fadeTo("slow",0.7);
});

Kişisel olarak deneyin

jQuery Etki Referans Kılavuzu

jQuery etkilerini tam olarak incelemek için sitemizi jQuery Etki Referans Kılavuzu