067 607 57 84
заповніть форму нижче:
Настає час, коли формат зображення GIF відходить у минуле. У сучасному браузері нескладно зробити анімацію без цього формату, використовуючи JavaScript або ж чистий CCS3. Звичайно, знайдуться противники такої технології, які будуть говорити, що простіше використовувати GIF для цих цілей, але кожен для себе вибере той спосіб, який йому ближче.
Код css:
.hi {
width: 50px;
height: 72px;
background-image: url("http://site/img/sprite.png");
-webkit-animation: play .8s steps(10) infinite;
-moz-animation: play .8s steps(10) infinite;
-ms-animation: play .8s steps(10) infinite;
-o-animation: play .8s steps(10) infinite;
animation: play .8s steps(10) infinite;
}
@-webkit-keyframes play {
from { background-position: 0px; }
to { background-position: -500px; }
}
@-moz-keyframes play {
from { background-position: 0px; }
to { background-position: -500px; }
}
@-ms-keyframes play {
from { background-position: 0px; }
to { background-position: -500px; }
}
@-o-keyframes play {
from { background-position: 0px; }
to { background-position: -500px; }
}
@keyframes play {
from { background-position: 0px; }
to { background-position: -500px; }
}
Код HTML:
<img src="http://site/img/sprite.png" />
<div class="hi"></div>
Працює у всіх сучасних браузерах.