[Solved] How to create a pure css slideshow? [closed]


How about this Fiddle

#container{
    background:green;
    width:300px;
    height:300px;
    overflow:hidden;
}
.img{
    
    -webkit-animation:up 20s infinite;
}

.img{
    height:300px;
}

@-webkit-keyframes up{
    0%{transform:translate(0,0)}
    20%{transform:translate(0,-300px)}
     40%{transform:translate(0,-600px)}
     60%{transform:translate(0,-900px)}
     80%{transform:translate(0,-1200px)}
    100%{transform:translate(0,-1500px)}
}
<div id="container">
<div class="img ">
    <img src="http://placekitten.com/300/301">
</div>
<div class="img ">
    <img src="http://placekitten.com/300/302">
</div>
<div class="img ">
    <img src="http://placekitten.com/300/303">
</div>
<div class="img ">
    <img src="http://placekitten.com/300/304">
</div>
<div class="img  ">
    <img src="http://placekitten.com/300/305">
</div>
    <div class="img  ">
    <img src="http://placekitten.com/300/306">
</div>
    </div>

solved How to create a pure css slideshow? [closed]