test animation
This commit is contained in:
parent
f7fa411bcf
commit
aac143a090
@ -577,9 +577,73 @@ a.paginate_button.next:after {
|
||||
|
||||
div#home-top-div{
|
||||
height: 661px;
|
||||
width: 100%;
|
||||
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{
|
||||
width: 100%;
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user