✅ اضافة تأثير التحميل على شكل سبينر - روتكس

اضافة تأثير التحميل على شكل سبينر

اضافة تأثير التحميل على شكل سبينر - سبينر هى لعبة ثلاثية الأجنحة تقوم بالدوران بشكل محوري حول نفسها، ويعتقد أنها تساعد في إكتساب الهدوء والتخلص من التوتر، وحتى لا نتكلم عن التفاصيل تم تصميم صورة متحركة على شكل سبينر يمكن تركيبها للمدونات والمواقع، ولكن هذا الدرس التعليمى عن تأثير التحميل على شكل سبينر متحرك.

اضافة تأثير التحميل على شكل سبينر

معاينة شكل سبينر التحميل :


ترغب فى تجربة الاضافة، اتبع الخطوات التالية

اضافة تأثير التحميل على شكل سبينر


1. اذهب الى لوحة التحكم > القالب > تحرير HTML

2. ابحث عن ]]></b:skin> ، وضع الكود التالي فوقه

#page-loader{position:fixed!important;position:absolute;top:0;right:0;bottom:0;left:0;z-index:999999;background:#fff url('https://loading.io/spinners/fidget-spinner/index.fidget-spinner.gif') no-repeat 50% 50%;
padding:1em 1.2em;display:none}

3. ابحث عن </body> ، وضع الكود التالي فوقه

<script type='text/javascript'>
//<![CDATA[
$(document.body).append('<div id="page-loader"></div>');
$(window).on("beforeunload", function() {
$('#page-loader').fadeIn(1000).delay(9000).fadeOut(1000);
});
//]]>
</script>

4. احفظ القالب

تخصيص تأثير التحميل


يمكنك تغيير رابط صورة سبينر المتحركة الموجودة فى الخطوة 2 اعلاها

https://loading.io/spinners/fidget-spinner/index.fidget-spinner.gif

لتغيير الصورة المتحركة اذهب الى https://loading.io وانسخ صورة التحميل المراد استخدامها بصيغة GIF.

إرسال تعليق

إظهار التعليقات

5 تعليقات

  1. أنا عملت ctrl+c مانسخ الكود

    ردحذف
  2. شكرا على مجهودك واتمنى لك التقدم بحياة سعيدة

    ردحذف
    الردود
    1. العفو شكرا لمرورك الطيب 🇵🇸🔝

      حذف
  3. ياصديقي انا اتصفح موقعك من الجوال لكن للاسف الشديد حضرتة غير مهتدم بلاشخاص الي يزورو موقعك من الجوال لا استطيع نسخ اي كود 😢

    ردحذف