jQuery Efektleri - Soluk


jQuery ile öğeleri görünürlükte ve görünürlükten uzaklaştırabilirsiniz.

Paneli açmak/kapatmak için tıklayın

Zaman değerli olduğu için hızlı ve kolay öğrenme sağlarız.

W3Schools'da öğrenmeniz gereken her şeyi erişilebilir ve kullanışlı bir formatta inceleyebilirsiniz.


Örnekler


jQuery fadeIn() yöntemini gösterir.


jQuery fadeOut() yöntemini gösterir.


jQuery fadeToggle() yöntemini gösterir.


jQuery fadeTo() yöntemini gösterir.


jQuery Fading Yöntemleri

jQuery ile bir öğeyi görünürlük içinde ve dışında soldurabilirsiniz.

jQuery, aşağıdaki solma yöntemlerine sahiptir:

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

jQuery fadeIn() Yöntemi

JQuery fadeIn()yöntemi, gizli bir öğede kaybolmak için kullanılır.

Sözdizimi:

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

İsteğe bağlı hız parametresi, etkinin süresini belirtir. Şu değerleri alabilir: "yavaş", "hızlı" veya milisaniye.

İsteğe bağlı geri çağırma parametresi, sönümleme tamamlandıktan sonra yürütülecek bir işlevdir.

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

Örnek

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


jQuery fadeOut() Yöntemi

jQuery fadeOut()yöntemi, görünür bir öğeyi karartmak için kullanılır.

Sözdizimi:

$(selector).fadeOut(speed,callback);

İsteğe bağlı hız parametresi, etkinin süresini belirtir. Şu değerleri alabilir: "yavaş", "hızlı" veya milisaniye.

İsteğe bağlı geri çağırma parametresi, sönümleme tamamlandıktan sonra yürütülecek bir işlevdir.

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

Örnek

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

jQuery fadeToggle() Yöntemi

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

Öğeler soluksa, fadeToggle()onları sokar.

Öğeler soluksa, fadeToggle()onları soldurur.

Sözdizimi:

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

İsteğe bağlı hız parametresi, etkinin süresini belirtir. Şu değerleri alabilir: "yavaş", "hızlı" veya milisaniye.

İsteğe bağlı geri çağırma parametresi, sönümleme tamamlandıktan sonra yürütülecek bir işlevdir.

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

Örnek

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

jQuery fadeTo() Yöntemi

jQuery fadeTo()yöntemi, belirli bir opaklığa (0 ile 1 arasındaki değer) solmaya izin verir.

Sözdizimi:

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

Gerekli hız parametresi, etkinin süresini belirtir. Şu değerleri alabilir: "yavaş", "hızlı" veya milisaniye.

Yöntemdeki gerekli opaklık parametresi, fadeTo()belirli bir opaklığa geçişi belirtir (0 ile 1 arasındaki değer).

İsteğe bağlı geri arama parametresi, işlev tamamlandıktan sonra yürütülecek bir işlevdir.

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

Örnek

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

jQuery Alıştırmaları

Egzersizlerle Kendinizi Test Edin

Egzersiz yapmak:

Bir <div> öğesini karartmak için bir jQuery yöntemi kullanın .

$("div").();


jQuery Efektleri Referansı

Tüm jQuery efektlerine tam bir genel bakış için lütfen jQuery Effect Reference sayfamıza gidin .