Membuat Obyek Berputar dengan CSS3 Rotate

Hallo teman-teman apa kabar.. Hari ini kita akan mempelajari bagaimana membuat suatu obyek berputar dengan menggunakan CSS3 Rotate. Tutorial ini merupakan dasar untuk membuat animasi bergerak berputar yang bisa kita terapkan pada obyek apapun seperti image, teks, tag,div dan sebagainya. Teman-teman bisa langsung mengetikkan kodenya dibawah ini :

See the Pen dDzFj by Rully Febrian (@rully) on CodePen.

Perhatikan kode diatas..margin-left: 420px; transform: rotate(720deg); mendefinisikan sebuah reaksi hover dimana obyek akan berputar sebanyak 2 kali berputar dengan jarak 420px dari posisi awal. Coba teman-teman ubah margin-left menjadi 50px dan lihat hasilnya.

Baik teman-teman demikian tutorial ini semoga bermanfaat dan menambah pengetahuan dalam membuat obyek berputar agar website kita lebih interactive. Terimakasih

DOWNLOAD