CARA MENAMBAH EFEK GOYANG PADA GAMBAR DI BLOG / WEBSITE

 

Untuk menambah lebih menarik lagi blog sobat, yaitu dengan menambah efek bergoyang pada setiap gambar yang ada di blog. Bagaimana caranya, silahkan ikuti langkah-langkah berikut ini :

1. Masuk ke BLOGGER
2. Pilih menu TEMA
3. Pilih EDIT HTML
4. Tempel di atas ]></b:skin>

 

.post-body img {display:inherit;transform-origin:center center}

img:hover img {animation-play-state:running}

@keyframes img {

  20% {transform: translate(-1px, -5px) rotate(2.5deg)}

  40% {transform: translate(5px, 1px) rotate(-2.5deg)}

  60% {transform: translate(-1px, -5px) rotate(2.5deg)}

  80% {transform: translate(5px, 1px) rotate(-2.5deg)}

  0%, 100% {transform: translate(0, 0) rotate(0)}

}

img:hover {animation-name:img;animation-duration:0.5s;animation-timing-function:ease-in-out}

 

Mudahkan, semoga bermanfaat