File tree Expand file tree Collapse file tree 1 file changed +10
-12
lines changed
02.Creative Loading Animation Expand file tree Collapse file tree 1 file changed +10
-12
lines changed Original file line number Diff line number Diff line change @@ -23,30 +23,28 @@ body {
23
23
24
24
.loader .loading {
25
25
background : # fff ;
26
- width : 30 px ;
27
- height : 30 px ;
26
+ width : 15 px ;
27
+ height : 15 px ;
28
28
border-radius : 50px ;
29
29
margin : 0 10px ;
30
- animation : load 0.8 s ease infinite;
30
+ animation : load 1.4 s ease infinite;
31
31
}
32
32
33
- .loader .loading .one {
34
- animation-delay : 0.3s ;
35
- }
36
33
.loader .loading .two {
37
- animation-delay : 0.4 s ;
34
+ animation-delay : 0.2 s ;
38
35
}
39
36
.loader .loading .three {
40
- animation-delay : 0.5s ;
37
+ animation-delay : 0.4s ;
38
+ }
39
+ .loader .loading .four {
40
+ animation-delay : 0.6s ;
41
41
}
42
42
43
43
@keyframes load {
44
44
0% {
45
- width : 30px ;
46
- height : 30px ;
45
+ transform : scale (1 , 1 );
47
46
}
48
47
50% {
49
- width : 20px ;
50
- height : 20px ;
48
+ transform : scale (1.5 , 1.5 );
51
49
}
52
50
}
You can’t perform that action at this time.
0 commit comments