test animation
This commit is contained in:
parent
f7fa411bcf
commit
aac143a090
@ -577,9 +577,73 @@ a.paginate_button.next:after {
|
|||||||
|
|
||||||
div#home-top-div{
|
div#home-top-div{
|
||||||
height: 661px;
|
height: 661px;
|
||||||
|
width: 100%;
|
||||||
border:blue solid 1px;
|
border:blue solid 1px;
|
||||||
|
overflow-x: hidden;
|
||||||
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#home-top-div img {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
max-width: 350px;
|
||||||
|
left: -600px;
|
||||||
|
padding: 60px;
|
||||||
|
|
||||||
|
animation-name: move;
|
||||||
|
animation-duration: 20s;
|
||||||
|
animation-iteration-count: infinite; /* or infinite*/
|
||||||
|
animation-fill-mode: forwards;
|
||||||
|
animation-direction: normal;
|
||||||
|
animation-timing-function: linear; /* or ease*/
|
||||||
|
}
|
||||||
|
|
||||||
|
#home-top-div:nth-child(even) { padding-top: 60px;}
|
||||||
|
#home-top-div:nth-child(odd) { padding-top: 0px; }
|
||||||
|
|
||||||
|
|
||||||
|
#home-top-div img:nth-of-type(1) {
|
||||||
|
animation-delay: 0s;
|
||||||
|
}
|
||||||
|
#home-top-div img:nth-of-type(2) {
|
||||||
|
animation-delay: 6s;
|
||||||
|
}
|
||||||
|
#home-top-div img:nth-of-type(3) {
|
||||||
|
animation-delay: 12s;
|
||||||
|
padding-top: 60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes move {
|
||||||
|
0% {
|
||||||
|
-webkit-transform: translateX(0px);
|
||||||
|
-ms-transform: translateX(0px);
|
||||||
|
-moz-transform: translateX(0px);
|
||||||
|
transform: translateX(0px);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
-webkit-transform: translateX(1650px); /* 250vw*/
|
||||||
|
-ms-transform: translateX(1650px);
|
||||||
|
-moz-transform: translateX(1650px);
|
||||||
|
transform: translateX(1650px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes move{
|
||||||
|
0% {
|
||||||
|
-webkit-transform: translateX(0px);
|
||||||
|
-ms-transform: translateX(0px);
|
||||||
|
-moz-transform: translateX(0px);
|
||||||
|
transform: translateX(0px);
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
-webkit-transform: translateX(1650px); /* 250vw*/
|
||||||
|
-ms-transform: translateX(1650px);
|
||||||
|
-moz-transform: translateX(1650px);
|
||||||
|
transform: translateX(1650px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
img.home-recent-imgs, img.browsethearchive-imgs{
|
img.home-recent-imgs, img.browsethearchive-imgs{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user