CARA MEMBUAT GAMBAR BERGUNCANG SAAT DISENTUH

Home css tricks tutorial CARA MEMBUAT GAMBAR BERGUNCANG SAAT DISENTUH

Banyak cara untuk menarik perhatian pemirsa agar terfokus pada satu tujuan, diantaranya membuat image atau gambar bererak pada saat disentuh kursor maupun jari pada postingan. Dan trik ini sangat ringan karena hanya menggunakan kode CSS.

1. Tambahkan CSS

Masuk ke pengaturan blogger>pilih tema atau theme> lalu pilih edit HTML:

Lalu cari kode </head> dan letakan kode CSS berikut tepat diatasnya, yakni di atas penutup </style>:

img:hover {
animation: shake 0.5s;
animation-iteration-count: infinite;
}
@keyframes shake {
0% { transform: translate(1px, 1px) rotate(0deg); }
10% { transform: translate(-1px, -2px) rotate(-1deg); }
20% { transform: translate(-3px, 0px) rotate(1deg); }
30% { transform: translate(3px, 2px) rotate(0deg); }
40% { transform: translate(1px, -1px) rotate(1deg); }
50% { transform: translate(-1px, 2px) rotate(-1deg); }
60% { transform: translate(-3px, 1px) rotate(0deg); }
70% { transform: translate(3px, 1px) rotate(-1deg); }
80% { transform: translate(-1px, -1px) rotate(1deg); }
90% { transform: translate(1px, 2px) rotate(0deg); }
100% { transform: translate(1px, -2px) rotate(-1deg); }

Save template.

Namun Kalian juga bisa membuat ikon SVG atau Awesome Icon berguncang pada saat disentuh dengan mengubah awalan 'img' (ditulis merah) tersebut dengan 'svg' Misalnya coba sentuh ikon love svg di bawah ini dengan kursor atau sentuhan halus jari:

www.editblogtema.com

Comments

Populer

CEWEK DENGAN WAJAH FRECKLES JADI TREND

Jadi ingat kalau dulu cewek dengan wajah bintik bintik hitam bakalan jadi rendah diri alias gak pede karena kan sebagai cewek wajah musti bersih dan fresh biar kelihatan mulus gitu. Jadi tidak heran banyak kaum cewek berusaha merawat wajah dan menghilangkan freckles alias bintik bintik samar di wajahnya. Tetapi sekarang banyak artikel yang bermnculan: Ayo buat wajahmu jadi freckles! LOL. Walaupun freklessnya fake. Lindsay Lohan Sampai ada lho yang kena di bully, dan akhirnya salah seorang pemilik wajah dengan freckless alami tersebut menjadi model terkenal yakni salah seorangnya dari Indonesia Ranty Maria. Siapa sangka trend model berubah dari zaman ke zaman. Kalian lihat teman teman pakai kawat gigi? alih alih buat memperbaiki posisi geraham dan gigi, kawat gigi malah jadi trend masa masa itu. Di kalangan cowok juga ada model rambut gaya punk, sampai gaya superman yang ada rambut ikal jatuh di dahi itu lho. Tapi itu sekarang sudah berakhir, yang mempertahankannya pasti bukan dari za

Download Update Template Blogger Notable simple versi kedua

Versi pertama telah kami rilis beberapa hari lalu. Update terpaksa kami berikan karena keluhan pengguna yang ingin agar tampilan konten full tanpa blank space disisi kanannya seperti tampilan bawaan atau tampilan defaultnya. Tampilan banyak blank tersebut tentu saja pada tampilan layar yang lebih lebar yakni pada layar PC desktop dan laptop. Jika kalian mengakses halaman melalui mobile seperti yakni tampilan pada layar / screen hape dan tablet 10 inchi maka tampilan tidak ada masalah. DEMO Click here DOWNLOAD Click here Sebenarnya dengan merombak bagian struktur 'body' template ini nyaris keluar dari tema aslinya. Akan tetapi kami kemudian berusaha merombaknya dari sumber kode bawaannya, yakni bagian CSSnya saja. Beruntungnya template notable adalah template CSS. Jadi ceritanya begini: Sebelum dan sesudah struktur body di rombak terlihat pada tampilan gambar berikut: Fiturnya kustomnya sekarang menjadi (perhatikan tulisan berwarna): Header: kustom Body:kustom (menjadi F

PANDORA BOX OR "KOTAK PANDORA"?

Some friends were asked me the meanings of "Kotak Pandora" and why my blog named such kind. Yes I love the Greek Mythology but I don't want adopt the myths for build up a whole lifetime of my blog with it, eventhough I am know it is very meaningful: "Pandora box" with its whole taboo secrets inside it. I know some of us are so curious. What is that indeed in the Greek Myth of Pandora's? The container mentioned in the original story was actually a large storage jar but the word was later mistranslated as "box". In modern times an idiom has grown from it meaning "Any source of great and unexpected troubles" or alternatively "A present which seems valuable but which in reality is a curse". Later depictions of the fatal container have been very varied, while some literary and artistic treatments have focused more on the contents of the idiomatic box than on Pandora herself. There is also an alternative tradition in which the divine

AdelinaBlog

Search This Blog