تأثيرات jQuery - يتلاشى


باستخدام jQuery ، يمكنك إخفاء العناصر داخل وخارج الرؤية.

انقر لتتلاشى داخل / خارج اللوحة

لأن الوقت ثمين ، فنحن نقدم تعلمًا سريعًا وسهلاً.

في W3Schools ، يمكنك دراسة كل ما تحتاج إلى تعلمه ، بتنسيق سهل الوصول إليه.


أمثلة


fadeIn () طريقة jQuery fadeIn ().


fadeOut () طريقة jQuery fadeOut ().


fadeToggle () طريقة jQuery fadeToggle ().


fadeTo () طريقة jQuery fadeTo ().


طرق التلاشي في jQuery

باستخدام jQuery ، يمكنك تلاشي عنصر داخل وخارج نطاق الرؤية.

يحتوي jQuery على طرق الخبو التالية:

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

طريقة jQuery fadeIn ()

تُستخدم طريقة jQuery للتلاشي fadeIn()في عنصر مخفي.

بناء الجملة:

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

تحدد معلمة السرعة الاختيارية مدة التأثير. يمكن أن يأخذ القيم التالية: "بطيء" أو "سريع" أو مللي ثانية.

معلمة رد الاتصال الاختيارية هي وظيفة يتم تنفيذها بعد اكتمال الخبو.

يوضح المثال التالي fadeIn()الطريقة مع معلمات مختلفة:

مثال

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


طريقة jQuery fadeOut ()

تُستخدم طريقة jQuery لإخفاء fadeOut()عنصر مرئي.

بناء الجملة:

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

تحدد معلمة السرعة الاختيارية مدة التأثير. يمكن أن يأخذ القيم التالية: "بطيء" أو "سريع" أو مللي ثانية.

معلمة رد الاتصال الاختيارية هي وظيفة يتم تنفيذها بعد اكتمال الخبو.

يوضح المثال التالي fadeOut()الطريقة مع معلمات مختلفة:

مثال

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

طريقة jQuery fadeToggle ()

fadeToggle()يبدل أسلوب jQuery بين التابعين fadeIn()و fadeOut() .

إذا تلاشت العناصر ، fadeToggle()فسوف تتلاشى فيها.

إذا تلاشت العناصر ، fadeToggle()فسوف تتلاشى.

بناء الجملة:

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

تحدد معلمة السرعة الاختيارية مدة التأثير. يمكن أن يأخذ القيم التالية: "بطيء" أو "سريع" أو مللي ثانية.

معلمة رد الاتصال الاختيارية هي وظيفة يتم تنفيذها بعد اكتمال الخبو.

يوضح المثال التالي fadeToggle()الطريقة مع معلمات مختلفة:

مثال

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

طريقة jQuery fadeTo ()

تسمح طريقة jQuery fadeTo()بالتلاشي إلى عتامة معينة (قيمة بين 0 و 1).

بناء الجملة:

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

تحدد معلمة السرعة المطلوبة مدة التأثير. يمكن أن يأخذ القيم التالية: "بطيء" أو "سريع" أو مللي ثانية.

تحدد معلمة العتامة المطلوبة في fadeTo()الطريقة التلاشي إلى عتامة معينة (قيمة بين 0 و 1).

معلمة رد الاتصال الاختيارية هي وظيفة يتم تنفيذها بعد اكتمال الوظيفة.

يوضح المثال التالي fadeTo()الطريقة مع معلمات مختلفة:

مثال

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

تمارين مسج

اختبر نفسك مع التمارين

ممارسه الرياضه:

استخدم طريقة jQuery لإخفاء عنصر <div>.

$("div").();


مرجع تأثيرات jQuery

للحصول على نظرة عامة كاملة على جميع تأثيرات jQuery ، يرجى الانتقال إلى مرجع تأثير jQuery .