Skip to content

Commit 78e3f5b

Browse files
zbryiktzbryikt
committed
update thumbnail and tweak speed
1 parent 8e54b83 commit 78e3f5b

File tree

12 files changed

+71
-69
lines changed

12 files changed

+71
-69
lines changed

‎README.md‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@
44

55
12 small, elegant pure css spinners collection for website ajax and loading animation.
66

7+
![css spinner](https://github.com/loadingio/css-spinner/blob/master/thumbnail.gif?raw=true)
8+
79

810
## Features
911

‎build/default/main.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
position: absolute;
99
width: 5px;
1010
height: 5px;
11-
background: #900;
11+
background: #fff;
1212
border-radius: 50%;
1313
animation: lds-default 1.2s linear infinite;
1414
}

‎build/default/sample.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
position: absolute;
1010
width: 5px;
1111
height: 5px;
12-
background: #900;
12+
background: #fff;
1313
border-radius: 50%;
1414
animation: lds-default 1.2s linear infinite;
1515
}

‎build/ellipsis/main.css‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10,24 +10,24 @@
1010
width: 11px;
1111
height: 11px;
1212
border-radius: 50%;
13-
background: #900;
13+
background: #fff;
1414
animation-timing-function: cubic-bezier(0, 1, 1, 0);
1515
}
1616
.lds-ellipsis div:nth-child(1) {
1717
left: 6px;
18-
animation: lds-ellipsis1 0.48s infinite;
18+
animation: lds-ellipsis1 0.6s infinite;
1919
}
2020
.lds-ellipsis div:nth-child(2) {
2121
left: 6px;
22-
animation: lds-ellipsis2 0.48s infinite;
22+
animation: lds-ellipsis2 0.6s infinite;
2323
}
2424
.lds-ellipsis div:nth-child(3) {
2525
left: 26px;
26-
animation: lds-ellipsis2 0.48s infinite;
26+
animation: lds-ellipsis2 0.6s infinite;
2727
}
2828
.lds-ellipsis div:nth-child(4) {
2929
left: 45px;
30-
animation: lds-ellipsis3 0.48s infinite;
30+
animation: lds-ellipsis3 0.6s infinite;
3131
}
3232
@keyframes lds-ellipsis1 {
3333
0% {

‎build/ellipsis/sample.html‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -11,24 +11,24 @@
1111
width: 11px;
1212
height: 11px;
1313
border-radius: 50%;
14-
background: #900;
14+
background: #fff;
1515
animation-timing-function: cubic-bezier(0, 1, 1, 0);
1616
}
1717
.lds-ellipsis div:nth-child(1) {
1818
left: 6px;
19-
animation: lds-ellipsis1 0.48s infinite;
19+
animation: lds-ellipsis1 0.6s infinite;
2020
}
2121
.lds-ellipsis div:nth-child(2) {
2222
left: 6px;
23-
animation: lds-ellipsis2 0.48s infinite;
23+
animation: lds-ellipsis2 0.6s infinite;
2424
}
2525
.lds-ellipsis div:nth-child(3) {
2626
left: 26px;
27-
animation: lds-ellipsis2 0.48s infinite;
27+
animation: lds-ellipsis2 0.6s infinite;
2828
}
2929
.lds-ellipsis div:nth-child(4) {
3030
left: 45px;
31-
animation: lds-ellipsis3 0.48s infinite;
31+
animation: lds-ellipsis3 0.6s infinite;
3232
}
3333
@keyframes lds-ellipsis1 {
3434
0% {

‎build/roller/main.css‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
height: 64px;
66
}
77
.lds-roller div {
8-
animation: lds-roller 1.56s cubic-bezier(0.5, 0, 0.5, 1) infinite;
8+
animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
99
transform-origin: 32px 32px;
1010
}
1111
.lds-roller div:after {
@@ -15,60 +15,60 @@
1515
width: 6px;
1616
height: 6px;
1717
border-radius: 50%;
18-
background: #900;
18+
background: #fff;
1919
margin: -3px 0 0 -3px;
2020
}
2121
.lds-roller div:nth-child(1) {
22-
animation-delay: -0.0468s;
22+
animation-delay: -0.036s;
2323
}
2424
.lds-roller div:nth-child(1):after {
2525
top: 50px;
2626
left: 50px;
2727
}
2828
.lds-roller div:nth-child(2) {
29-
animation-delay: -0.0936s;
29+
animation-delay: -0.072s;
3030
}
3131
.lds-roller div:nth-child(2):after {
3232
top: 54px;
3333
left: 45px;
3434
}
3535
.lds-roller div:nth-child(3) {
36-
animation-delay: -0.1404s;
36+
animation-delay: -0.108s;
3737
}
3838
.lds-roller div:nth-child(3):after {
3939
top: 57px;
4040
left: 39px;
4141
}
4242
.lds-roller div:nth-child(4) {
43-
animation-delay: -0.1872s;
43+
animation-delay: -0.144s;
4444
}
4545
.lds-roller div:nth-child(4):after {
4646
top: 58px;
4747
left: 32px;
4848
}
4949
.lds-roller div:nth-child(5) {
50-
animation-delay: -0.234s;
50+
animation-delay: -0.18s;
5151
}
5252
.lds-roller div:nth-child(5):after {
5353
top: 57px;
5454
left: 25px;
5555
}
5656
.lds-roller div:nth-child(6) {
57-
animation-delay: -0.2808s;
57+
animation-delay: -0.216s;
5858
}
5959
.lds-roller div:nth-child(6):after {
6060
top: 54px;
6161
left: 19px;
6262
}
6363
.lds-roller div:nth-child(7) {
64-
animation-delay: -0.3276s;
64+
animation-delay: -0.252s;
6565
}
6666
.lds-roller div:nth-child(7):after {
6767
top: 50px;
6868
left: 14px;
6969
}
7070
.lds-roller div:nth-child(8) {
71-
animation-delay: -0.3744s;
71+
animation-delay: -0.288s;
7272
}
7373
.lds-roller div:nth-child(8):after {
7474
top: 45px;

‎build/roller/sample.html‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
height: 64px;
77
}
88
.lds-roller div {
9-
animation: lds-roller 1.56s cubic-bezier(0.5, 0, 0.5, 1) infinite;
9+
animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
1010
transform-origin: 32px 32px;
1111
}
1212
.lds-roller div:after {
@@ -16,60 +16,60 @@
1616
width: 6px;
1717
height: 6px;
1818
border-radius: 50%;
19-
background: #900;
19+
background: #fff;
2020
margin: -3px 0 0 -3px;
2121
}
2222
.lds-roller div:nth-child(1) {
23-
animation-delay: -0.0468s;
23+
animation-delay: -0.036s;
2424
}
2525
.lds-roller div:nth-child(1):after {
2626
top: 50px;
2727
left: 50px;
2828
}
2929
.lds-roller div:nth-child(2) {
30-
animation-delay: -0.0936s;
30+
animation-delay: -0.072s;
3131
}
3232
.lds-roller div:nth-child(2):after {
3333
top: 54px;
3434
left: 45px;
3535
}
3636
.lds-roller div:nth-child(3) {
37-
animation-delay: -0.1404s;
37+
animation-delay: -0.108s;
3838
}
3939
.lds-roller div:nth-child(3):after {
4040
top: 57px;
4141
left: 39px;
4242
}
4343
.lds-roller div:nth-child(4) {
44-
animation-delay: -0.1872s;
44+
animation-delay: -0.144s;
4545
}
4646
.lds-roller div:nth-child(4):after {
4747
top: 58px;
4848
left: 32px;
4949
}
5050
.lds-roller div:nth-child(5) {
51-
animation-delay: -0.234s;
51+
animation-delay: -0.18s;
5252
}
5353
.lds-roller div:nth-child(5):after {
5454
top: 57px;
5555
left: 25px;
5656
}
5757
.lds-roller div:nth-child(6) {
58-
animation-delay: -0.2808s;
58+
animation-delay: -0.216s;
5959
}
6060
.lds-roller div:nth-child(6):after {
6161
top: 54px;
6262
left: 19px;
6363
}
6464
.lds-roller div:nth-child(7) {
65-
animation-delay: -0.3276s;
65+
animation-delay: -0.252s;
6666
}
6767
.lds-roller div:nth-child(7):after {
6868
top: 50px;
6969
left: 14px;
7070
}
7171
.lds-roller div:nth-child(8) {
72-
animation-delay: -0.3744s;
72+
animation-delay: -0.288s;
7373
}
7474
.lds-roller div:nth-child(8):after {
7575
top: 45px;

0 commit comments

Comments
 (0)