blob: aaeefbd881282c6d31cadd6ab8d6ed6b11d118ce (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
|
<!DOCTYPE html>
<style>
.animatedBackground {
width: 70px;
height: 80px;
position: absolute;
background: url("./square-blue-100x100.png") no-repeat 0 0 transparent;
animation: anim 4s steps(6) infinite;
}
.transformedItem {
transform: translate3d(42px, 43px, 0);
width: 40px;
height: 50px;
background-color: green;
}
@keyframes anim {
100% {
background-position: 9px 10px
}
}
</style>
<div class="animatedBackground"></div>
<div class="transformedItem"></div>
|
