Cara Membuat Gambar di Dalam postingan Menjadi Berputar

Baca Juga

Cara Membuat Gambar di Dalam postingan Menjadi Berputar – Setiap Postingan di anjurkan untuk memiliki sebuah gambar untuk mendukung maksud dari sebuah postingan tentang apa yang di bahas di dalamnya, tidak hanya itu dengan menambahkan gambar di dalam postingan membuat pengunjung akan lebih mudah paham.

Namun untuk menambah minat dan daya tarik sebuah blog di perlukan adanya efek yang menarik dan unik atau lain dari pada yang lain, terlebih lagi efek pada sebuah gambar. Maka dari itu kali ini saya akan bagikan tutorial bagaimana cara agar kita dapat mebuat semua gambar di dalam postingan dapat berputar secara otomatis.

Sistim nya ketika ada pengunjung yang mengarahkan kursornya kepada sebuah gambar di dalam postingan maka gambar tersebut akan menampilkan efek berputar, namun jika kursor tidak di arahkan kepada gambar maka gambar tersebut tidak akan berputar. Menari bukan!?. Di sini saya akan menggunakan kode CSS Transfrom untuk pembuatan efeknya. Untuk lebih lengkapnya silahkan simak cara membuatnya berikut ini

1. buka blog sobat > Masuk menu Template > Edit HTML > salin kode di bawah ini dan letakkan di atas kode </head>

<style type='text/css'>
body img{
  -webkit-transition: -webkit-transform 1.1s ease-in-out;
  transition: transform 1.1s ease-in-out;
}
body img:hover{
  -webkit-transform: rotate(360deg);
  transform: rotate(360deg);
}
</style>

2. simpan setelan dan lihat hasilnya dengan membuka blog sobat lalu arahkan kursor kepada gambar yang ada pada postingan sobat.

Demikianlah tutorial mengenai Cara Membuat Gambar di Dalam postingan Menjadi Berputar, yang harus di ketahui. dengan begini sobat sudah belajar dan lebih tahu tentang macam-macam efek pada sebuah gambar postingan yang bisa sobat coba terapkan di dalam situs milik sobat. Cara Membuat Gambar di Dalam postingan Menjadi Berputar