اضافة تاثير التحميل بشكل احترافي ورائع لمدونات بلوجر
السلام عليكم ورحة الله وبركاته
اليكم اصدقائي اضافة تاثير رائعة وممتازه
وهو شكل رائع وبسيط وجزاب
وميزة هذا الشكل انه
هذا الشكل جيد وبالالوان ايضا
وسريع وجميل والوان مريحة للعين
وهو اشبه لويندوز 8 او 8.1 او 10
- اذهب الي لوحة تحكم بلوجر
- قم بتحرير قالب html
- ابحث عن الوسم <body>
- قم بوضع الكود التالي فوقه
<div class='containe'>
<div class='loader-wrapper'>
<img alt='logo' src='http://store6.up-00.com/2017-01/148581037250541.png' width='120'/>
<div class='loader'>
<span class='pip pip-1'/>
<span class='pip pip-2'/>
<span class='pip pip-3'/>
<span class='pip pip-4'/>
<span class='pip pip-5'/>
<span class='pip pip-6'/>
</div>
</div>
</div>
<script>//<![CDATA[
// PreLoader
$(window).load(function()
{
$(".loader-wrapper .loader").fadeOut(1700);
$(".containe").fadeOut(1700);
$('html').delay(1700).css({'overflow':'visible'});
});
//]]>
</script>
<style>html{height:100%;overflow:hidden;}.containe{position:fixed;z-index:99999;width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;background:#f89029}.loader-wrapper{position:relative;text-align:center;width:300px;height:300px}.loader{border-radius:50%;height:120px;width:120px;left:50%;position:absolute;top:50%;transform:translate3d(-50%,0px,0px);filter:url(#goo)}.loader span{position:absolute;left:50%;width:20px;height:20px;border-radius:50%;background-color:#fff;display:block;transform-origin:0 60px 0;animation-fill-mode:forwards;animation-duration:2500ms;animation-iteration-count:infinite;animation-timing-function:cubic-bezier(0.74,0.23,0.1,0.95);animation-name:rotate}.pip-1{animation-delay:0}.pip-2{animation-delay:100ms}.pip-3{animation-delay:200ms}.pip-4{animation-delay:300ms}.pip-5{animation-delay:400ms}.pip-6{animation-delay:500ms}@keyframes rotate{0%{transform:rotate(0deg);width:20px;height:20px}50%{width:10px;height:10px}100%{transform:rotate(360deg);width:20px;height:20px}}</style>
- ثم قم بحفظ القالب ومبروك الاضافة
كاتب الموضوع :
ليست هناك تعليقات:
إرسال تعليق