|
|
1行目: |
1行目: |
| .loading {
| | hov { |
| position: absolute;
| | background-color: black; |
| top: 50%;
| |
| left: 5%;
| |
| transform: translateY(-50%);
| |
| border: 3px solid #fafafa;
| |
| border-top: 3px solid #3498db;
| |
| border-radius: 50%;
| |
| width: 24px;
| |
| height: 24px;
| |
| animation: spin 1s linear infinite;
| |
| } | | } |
| @keyframes spin {
| |
| 0% {
| |
| transform: translateY(-50%) rotate(0deg);
| |
| }
| |
|
| |
|
| 25% {
| | hov:hover { |
| transform: translateY(-50%) rotate(60deg);
| | background-color: white; |
| }
| |
| | |
| 50% {
| |
| transform: translateY(-50%) rotate(180deg);
| |
| }
| |
| | |
| 75% {
| |
| transform: translateY(-50%) rotate(300deg);
| |
| }
| |
| | |
| 100% {
| |
| transform: translateY(-50%) rotate(360deg);
| |
| }
| |
| } | | } |