Na webovej stránke mám niekolko elementov(obrázky), a potrebujem aby sa neustále pohybovali z lavého okraja stánky ku pravému a späť. Vtipné na tom je, že vopred nie je známa dĺžka všetkých obrázkov dokopy ani šírka kontajneru v ktorom sa toto má diať. Keby to fungovalo tak ako si to predstavujem, tak by to bola jednoduchá vec.
Kód: Vybrať všetko
.wrapper {
width: 100%;
background-color: #ffffff;
position: relative;
height: 50px;
line-height: 50px;
overflow: hidden;
}
.marquee {
position: absolute;
left: 80%
width: 100%;
background-color: #fff;
animation-name: marquee;
animation-duration: 8s;
animation-timing-function: linear;
animation-iteration-count: infinite;
animation-direction: alternate;
display: flex;
overflow: hidden;
}
@keyframes marquee {
from {
left: 5%;
}
to {
right: 5%; // a presne takto to nefunguje
}
}