di html nya ketik gini :

<div id="slider" >

<div id="images">
<img src="images/1.jpg" />
<img src="images/2.jpg" />
<img src="images/3.jpg" />
</div>
</div>
(terserah km mau pake brp gambar tar tinggal ditambahin aja img src nya)
(trus di css nya ketik gini)
#slider {
width: 759px; //lebar slider nya
height: 300px; //tinggi slidernya
overflow: hidden; /* supaya ga keluar dari layar */
}
#images {
width: 2277px; //jumlah lebar gambarnya, misalnya ada 4 , satu gambar 2
0px berarti 4x20=80px
height: 300px; //tinggi gambarnya
animation-name: sliding;
animation-duration: 10s;
animation-iteration-count: infinite;
}
#images > img { /* buat nunjuk tag img didalam images */
width: 759px; //ini lebar 1 gambarnya
height: 768px; //yg ini ga tau
float:left;
}
@keyframes sliding{
0%{
transform: translateX(0px); /*gerakin gambarnya ( translateX =
gerakin ke samping ) */
}
33%{
transform: translateX(-759px); //yg ini dikurang"in aja, misalny
a ada 4 gambar berarti presentasenya sesuai gambar & dikurang"in aja
}
66%{
transform: translateX(-1518px);
}
100%{
transform: translateX(0px);
}
}