Dernière modification : décembre 2022
<figure>
<img src="image1.jpg" alt/>
<img src="image2.jpg" alt/>
<img src="image3.jpg" alt/>
<img src="image4.jpg" alt/>
<img src="image1.jpg" alt/>
</figure>
*{box-sizing: border-box}
body {
margin: 0;
display: grid;
min-height: 100vh;
}
figure{
width: 500%;
display: flex;
animation: 20s animation_slide infinite;
}
figure img{
pointer-events: none;
object-fit: cover;
width: 20%;
aspect-ratio: 16/9;
margin: auto
}
@keyframes animation_slide {
0% {transform:translatex(0)}
20%{transform:translatex(0)}
25%{transform:translatex(-20%)}
45%{transform:translatex(-20%)}
50%{transform:translatex(-40%)}
70%{transform:translatex(-40%)}
75%{transform:translatex(-60%)}
95%{transform:translatex(-60%)}
100%{transform:translatex(-80%)}
}