Категорія: CSS

Анимация css

Пример анимации на CSS очень прикольно! 🙂

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
26

.uwloader{
	background: url(http://my-opinions.info/wp-content/uploads/2014/09/preloader.png) no-repeat;
	background-size: 80px 80px;
	position: fixed;
	top: 50%;
	left: 50%;
	margin-left: -30px;
	margin-top: -30px;
	width: 80px;
	height: 80px;
	-webkit-animation: rotateplane 2s infinite ease-in-out;
	animation: rotateplane 2s infinite ease-in-out;
}
@-webkit-keyframes rotateplane {
    0% {
    -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg)
	}
	25% {
	    -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg)
	}
	50% {
	    -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg)
	}
	75% {
	    -webkit-transform: perspective(120px) rotateX(0deg) rotateY(-179.9deg)
	} <a href="http://my-opinions.info/en/programing/css/animaciya-css#more-266" class="more-link">Continue reading <span class="screen-reader-text">Анимация css</span></a>