Ένας Loaders διαφορετικός από τους άλλους



Ένας Loaders διαφορετικός από τους άλλουςγια το blog και το site σας.

Αντιγραφή επικόλληση τον παρακάτω κώδικα:


<style>
/* foulscode.blogspot.gr */
body { background:black; overflow:hidden; }
div {
  height:150px; width:150px;
  border:2px solid white;
  position:absolute; top:50%; left:50%;
 
  -webkit-transform: perspective(600px) rotateX(64.5deg) rotate(45deg);
  -webkit-transform-origin: top left;
  -webkit-transform-style: preserve-3D;
transform: perspective(600px) rotateX(64.5deg) rotate(45deg);
  transform-origin: top left;
  transform-style: preserve-3D;
}
div:nth-child(1) { top:  50%; -webkit-animation:first   3.5s infinite; animation:first   3.5s infinite; }
div:nth-child(2) { top:47.5%; -webkit-animation:second  3.5s infinite; animation:second  3.5s infinite; }
div:nth-child(3) { top:  45%; -webkit-animation:third   3.5s infinite; animation:third   3.5s infinite; }
div:nth-child(4) { top:42.5%; -webkit-animation:fourth  3.5s infinite; animation:fourth  3.5s infinite; }
div:nth-child(5) { top:  40%; -webkit-animation:fifth   3.5s infinite; animation:fifth   3.5s infinite; }
div:nth-child(6) { top:37.5%; -webkit-animation:sixth   3.5s infinite; animation:sixth   3.5s infinite; }
div:nth-child(7) { top:  35%; -webkit-animation:seventh 3.5s infinite; animation:seventh 3.5s infinite; }
div:nth-child(8) { top:32.5%; -webkit-animation:eighth  3.5s infinite; animation:eighth  3.5s infinite; }
div:nth-child(9) { top:  30%; -webkit-animation:ninth   3.5s infinite; animation:ninth   3.5s infinite; }
@keyframes first {
  98%     { top:  50%; }
  3%      { top:  50%; }
  50%     { top: -37%; }
  50.001% { top: 125%; }
}
@keyframes second {
  98.5%   { top:47.5%; }
  3.5%    { top:47.5%; }
  50%     { top: -38%; }
  50.001% { top: 125%; }
}
@keyframes third {
  99%     { top:  45%; }
  4%      { top:  45%; }
  50%     { top: -40%; }
  50.001% { top: 125%; }
}
@keyframes fourth {
  99.5%   { top:42.5%; }
  4.5%    { top:42.5%; }
  50%     { top: -41%; }
  50.001% { top: 125%; }
}
@keyframes fifth {
  0%      { top:  40%; }
  5%      { top:  40%; }
  50%     { top: -43%; }
  50.001% { top: 125%; }
}
@keyframes sixth {
  0.5%    { top:37.5%; }
  5.5%    { top:37.5%; }
  50%     { top: -44%; }
  50.001% { top: 125%; }
}
@keyframes seventh {
  1%      { top:  35%; }
  6%      { top:  35%; }
  50%     { top: -45%; }
  50.001% { top: 125%; }
}
@keyframes eighth {
  1.5%    { top:32.5%; }
  6.5%    { top:32.5%; }
  50%     { top: -47%; }
  50.001% { top: 125%; }
}
@keyframes ninth {
  2%      { top:  30%; }
  7%      { top:  30%; }
  50%     { top: -48%; }
  50.001% { top: 125%; }
}
@-webkit-keyframes first {
  98%     { top:  50%; }
  3%      { top:  50%; }
  50%     { top: -37%; }
  50.001% { top: 125%; }
}
@-webkit-keyframes second {
  98.5%   { top:47.5%; }
  3.5%    { top:47.5%; }
  50%     { top: -38%; }
  50.001% { top: 125%; }
}
@-webkit-keyframes third {
  99%     { top:  45%; }
  4%      { top:  45%; }
  50%     { top: -40%; }
  50.001% { top: 125%; }
}
@-webkit-keyframes fourth {
  99.5%   { top:42.5%; }
  4.5%    { top:42.5%; }
  50%     { top: -41%; }
  50.001% { top: 125%; }
}
@-webkit-keyframes fifth {
  0%      { top:  40%; }
  5%      { top:  40%; }
  50%     { top: -43%; }
  50.001% { top: 125%; }
}
@-webkit-keyframes sixth {
  0.5%    { top:37.5%; }
  5.5%    { top:37.5%; }
  50%     { top: -44%; }
  50.001% { top: 125%; }
}
@-webkit-keyframes seventh {
  1%      { top:  35%; }
  6%      { top:  35%; }
  50%     { top: -45%; }
  50.001% { top: 125%; }
}
@-webkit-keyframes eighth {
  1.5%    { top:32.5%; }
  6.5%    { top:32.5%; }
  50%     { top: -47%; }
  50.001% { top: 125%; }
}
@-webkit-keyframes ninth {
  2%      { top:  30%; }
  7%      { top:  30%; }
  50%     { top: -48%; }
  50.001% { top: 125%; }
}
/* foulscode.blogspot.gr */
</style>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>



Και μετά αποθήκευση.

Για τυχόν απορίες αφήστε το σχολειό σας!



Σχόλια