موتینِکس

مرجع کد و ابزار و گرافیک

موتینِکس

مرجع کد و ابزار و گرافیک

کد لودینگ با css

چهارشنبه, ۳۱ ارديبهشت ۱۳۹۳، ۰۱:۴۴ ب.ظ
برای بارگذاری این کد در وبلاگ خودتون باید کد A رو بزارین قبل از </head> تو قالبتون و کد B رو بزارین هر جا که می خواین نشون داده بشه.
کد A:
<style>
@keyframes motinx{
from{transform:rotate(0deg);}
to{transform:rotate(180deg);}
}
@-moz-keyframes motinx{
from{-moz-transform:rotate(0deg);}
to{-moz-transform:rotate(180deg);}
}
@-o-keyframes motinx{
from{-o-transform:rotate(0deg);}
to{-o-transform:rotate(180deg);}
}
@-webkit-keyframes motinx{
from{-webkit-transform:rotate(0deg);}
to{-webkit-transform:rotate(180deg);}
}
@-ms-keyframes motinx{
from{-ms-transform:rotate(0deg);}
to{-ms-transform:rotate(180deg);}
}
.motinxLoading{
border-radius:100px;
-moz-border-radius:100px;
-o-border-radius:100px;
-ms-border-radius:100px;
-webkit-border-radius:100px;
width:50px;
height:50px;
border:3px transparent solid;
border-right-color:#036;
border-left-color:#036;
margin:0 auto;
animation:motinx .5s infinite linear;
-moz-animation:motinx .5s infinite linear;
-o-animation:motinx .5s infinite linear;
-webkit-animation:motinx .5s infinite linear;
-ms-animation:motinx .5s infinite linear;
}
</style>
کد B:
<div class="motinxLoading"></div>

منبع اصلی: moisrex
ویرایش توسط: motinx

googlereader googleplus stumbleupon digg cloob twitter facebook

نظرات (۱)

خیلی جالب بود داشی دمت گرم
پاسخ:
خواهش می کنم؛ امیدوارم به دردتون بخوره :)

ارسال نظر

ارسال نظر آزاد است، اما اگر قبلا در بیان ثبت نام کرده اید می توانید ابتدا وارد شوید.
تجدید کد امنیتی