من : غزل..ᥫ᭡
وَأشْرَقَتِ الأَرْضُ بِنُورِكُمْ، وَفازَ الْفائِزُونَ بِوِلايَتِكُمْ" 💚 ‏نبارك لكم ذكرى مولد منقذ البشرية الإمام المهدي المنتظر (عجل الله فرجه الشريف) 🥹🌷🌿
من : غزل..ᥫ᭡
-السّلامُ على من تنحني الرُؤوس بِذكرِ إسمه 🤍
من : غزل..ᥫ᭡
يَارب لُطفك بقلوبِنا وأحوالِنا وأيامِنا، واجعلْ لَنا فيها من الخيرِ الكَثير، وتولّ ما في قلوبِنا بفضلِك وسعتِك يا وهابَ السّعة♥️🕊
من : غزل..ᥫ᭡
ياهلا فيك @Gardi نورتي مكانك .. الحمد الله على كل حال .. 🌺🕊
  • من : غزل..ᥫ᭡
    وَأشْرَقَتِ الأَرْضُ بِنُورِكُمْ، وَفازَ الْفائِزُونَ بِوِلايَتِكُمْ" 💚 ‏نبارك لكم ذكرى مولد منقذ البشرية الإمام المهدي المنتظر (عجل الله فرجه الشريف) 🥹🌷🌿
  • من : غزل..ᥫ᭡
    -السّلامُ على من تنحني الرُؤوس بِذكرِ إسمه 🤍
  • من : غزل..ᥫ᭡
    يَارب لُطفك بقلوبِنا وأحوالِنا وأيامِنا، واجعلْ لَنا فيها من الخيرِ الكَثير، وتولّ ما في قلوبِنا بفضلِك وسعتِك يا وهابَ السّعة♥️🕊
  • من : غزل..ᥫ᭡
    ياهلا فيك @Gardi نورتي مكانك .. الحمد الله على كل حال .. 🌺🕊
  • منتديات شباب الرافدين .. تجمع عراقي يقدم محتوى مميز لجميع طلبة وشباب العراق .. لذا ندعوكم للانضمام الى اسرتنا والمشاركة والدعم وتبادل الافكار والرؤى والمعلومات. فأهلاَ وسهلاَ بكم.
Ibn AliraQ

درس XF-2.x اضافة تأثير جميل على زر تسجيل في المنتدى

Ibn AliraQعضوية موثقة

ヅ واحد من الناس ヅ

المدير العام للمنتديات
السمعة: 100%
2018-08-28
17,524
6,923
297
العراق
www.shababalrafedain.com
جوهرة
დ118,810
الجنس
ذكر
السلام عليكم ورحمة الله وبركاته

اعضاءنا وزوارنا الكرام ..

[العنوان] اضافة تأثير جميل على زر تسجيل في المنتدى
[مثال] مطبق الشرح على منتديات شباب الرافدين - سوي تسجيل خروج وشوف المثال.
[التوافق] منتديات الجيل الثاني حتى اصدار 2.0.9 ( آخر نسخة )
[الشرح] الطريقة بسيطة فقط اتبع الخطوات التالية < يفضل اخذ نسخة من اي قالب تعدل عليه لضمان عدم تلف القالب في حال اي خطأ في التطبيق >

1. نذهب الى المظهر - البحث في القوالب - نبحث عن قالب : page_container

2. داخل القالب نبحث عن الكود التالي :

HTML:
<span class="p-navgroup-linkText">{{ phrase('register') }}</span>

نستبدله بالكود التالي :

HTML:
<span class="p-navgroup-linkText"><span class="pulse">{{ phrase('register') }}</span></span>

نسوي حفظ.

نبحث عن قالب : extra.less

آخر القالب نضيف الكود التالي :

CSS:
/* PULSE ANIMATION */
.pulse {
    position: relative;
  box-shadow: 0 0 0 0 rgba(232, 76, 61, 0.7);
  cursor: pointer;
  -webkit-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  -moz-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  -ms-animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  animation: pulse 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
}
.pulse:hover {
  -webkit-animation: none;-moz-animation: none;-ms-animation: none;animation: none;
}
@-webkit-keyframes pulse {to {box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);}}
@-moz-keyframes pulse {to {box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);}}
@-ms-keyframes pulse {to {box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);}}
@keyframes pulse {to {box-shadow: 0 0 0 45px rgba(232, 76, 61, 0);}}

إنتهى الشرح
ان شاء الله يكون واضح للجميع .

اي سؤال اطرحه هنا بالموضوع.
مودتي ...
 
إشعار - Mention رد
  • أعجبني
التفاعلات: AnIs
Similar threads الاكثر مشاهدة عرض المزيد
عودة
أعلى أسفل