مدونة يهمك مدونة يهمك

آخر الأخبار

جاري التحميل ...

اضافة تأثير تحميل بشكل جديد لقوالب بلوجر

اهلا بكم متابعين مدونة يهمك في شرح جديد في قسم اضافات بلوجر
اليوم اقدم لكم اضافة جديده وهيا تأثير تحميل بكشل جديد علي شكل شحنه كهربائية

المعاينه - اضغط هناا

والان بعد المعاينه نتجة الي شرح تركيب الاضافة

اولاا ابحث عن وسم <head/> او </head>

ثم ضع فوقة كود الاستايل التالي


<style>
 div#loading-yhmaklod{right:0;bottom:0;position:fixed;z-index:99999999999999999999;display:block;left:0;top:0;background:#fff;width:100%;height:100%}
.indicator{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(2)}
.indicator svg polyline{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.indicator svg polyline#back{stroke:rgba(59,211,171,0.3)}
.indicator svg polyline#front{stroke:#3bd3ab;stroke-dasharray:12,36;stroke-dashoffset:48;animation:dash 1s linear infinite}
.cta{position:fixed;bottom:20px;right:30px;color:#222;font-weight:bold}
@-moz-keyframes dash{62.5%{opacity:0}to{stroke-dashoffset:0}}
@-webkit-keyframes dash{62.5%{opacity:0}to{stroke-dashoffset:0}}
@-o-keyframes dash{62.5%{opacity:0}to{stroke-dashoffset:0}}
@keyframes dash{62.5%{opacity:0}to{stroke-dashoffset:0}}
</style>
   
بعد تركيب الاستايل تبحث علي وسم بداية البودي وتضع فوقة الكود التالي

ابحث عن <body> او <body

ثم ضع تحته مباشرة الكود التالي


<div id='loading-yhmaklod'>
<div class="indicator">

  <svg width="16px" height="12px">
    <polyline id="back" points="1 6 4 6 6 11 10 1 12 6 15 6"></polyline>
    <polyline id="front" points="1 6 4 6 6 11 10 1 12 6 15 6"></polyline>
  </svg>
</div>
</div>
<script type='text/javascript'>
  $(window).load(function(){
   $("#loading-yhmaklod").fadeOut(1000)
  });
 </script>
  

والان مبروك عليك تم تركيب الاضافة بنجاح وان واجهتك اي مشكلة لا تتردد ب وضع مشكلتك في الكومنت وسارد عليك ب حلها ان شاء الله

كاتب الموضوع

Iprahim Magdy

0 تعليق على موضوع : اضافة تأثير تحميل بشكل جديد لقوالب بلوجر

  • اضافة تعليق

  • الأبتساماتأخفاء الأبتسامات



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

    إتصل بنا

    حمل تطبيقنا

    المتابعون

    Adblock Detected

    هل يعجبك المحتوي الخاص بنا !!

    رجائا عزيزي الزائر اغلاق اضافة مانع الاعلانات لانها السبيل الوحيد لدعم المدون واستمرار المدونة في العمل

    ×

    زوار المدونة

    Statistics

    احصاءات المدونة

    جميع الحقوق محفوظة لـ

    مدونة يهمك

    2017