Blockquote Goyang-Goyang

Assalamualaikum. Hai peeps.. Alangkah indahnya kalau ada orang lamar SD kawen, haha.. Gatal la SD ni. Bukan apa, serunya dah sampai tapi jodohnya belum ada lagi. Sedih je rasanya. Korang doa2kan la SD cepat dapat jodoh. nanti bila kendurinya SD jemput semua para pembaca/pelawat yang penah datang ushar blog SD ni.. hehe.. oke balik pada citer dia. sebenarnya ade budak tomey ni tanya..

Hah.. Nak tahu camne blockquote goyang2 uw? Ni SD nak tunjuk..

Haaa.. ni la Blockquote goyang2 tu..

Template designer/blog skin
- Cari code blockquote {  atau yang sama macam code tu dan delete code tersebut
- Copy code dekat bawah dan paste kan dekat tempat yang sama korang padam tadi tu.

-webkit-user-select:text;
-moz-user-select:text;
-webkit-animation-name: shake;
-webkit-animation-duration: 2s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: ease-in-out;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtel3GfvwvRTZIIipUaPMMOcLNW3jgGrZNW7eoBfGsuldotLYzhRFX66YE7pWIvh6yFkXxXWj3sCoPZNuLialMl7rdt0tRjFiwxci6dvupcdlmkHE40acAkJ5Yz6zllFeQb2oDtGY_zTQ/s1600/butterflygrey.png);
padding:15px;
border-top:3px solid #FFC6BC;
border-bottom:5px double #FFC6BC;
border-right:1px dashed #A7D3D2;
border-left:1px dashed #A7D3D2;
color:#000000;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;}

blockquote:hover{
-webkit-animation-name: none;
-webkit-animation-duration: 2s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: ease-in-out;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
color:#555;}
@-moz-keyframes shake /* Firefox*/
{
{ -ms-transform:: translate(-1px, -2px) rotate(-1deg); }
 20% { -moz-transform: translate(-3px, 0px) rotate(1deg); }
 30% { -moz-transform:  translate(0px, 2px) rotate(0deg); }
 40% { -moz-transform:  translate(1px, -1px) rotate(1deg); }
 50% { -moz-transform:  translate(-1px, 2px) rotate(-1deg); }
 60% { -moz-transform:  translate(-3px, 1px) rotate(0deg); }
 70% { -moz-transform:  translate(2px, 1px) rotate(-1deg); }
 80% { -moz-transform:  translate(-1px, -1px) rotate(1deg); }
 90% { -moz-transform: translate(2px, 2px) rotate(0deg); }
 100% { -moz-transform:  translate(1px, -2px) rotate(-1deg); }
}
@-ms-keyframes shake /* IE9*/
{
10% { -ms-transform:: translate(-1px, -2px) rotate(-1deg); }
 20% { -ms-transform: translate(-3px, 0px) rotate(1deg); }
 30% { -ms-transform: translate(0px, 2px) rotate(0deg); }
 40% { -ms-transform: translate(1px, -1px) rotate(1deg); }
 50% { -ms-transform: translate(-1px, 2px) rotate(-1deg); }
 60% { -ms-transform: translate(-3px, 1px) rotate(0deg); }
 70% { -ms-transform: translate(2px, 1px) rotate(-1deg); }
 80% { -ms-transform: translate(-1px, -1px) rotate(1deg); }
 90% { -ms-transform: translate(2px, 2px) rotate(0deg); }
 100% { -ms-transform: translate(1px, -2px) rotate(-1deg); }
}
@-webkit-keyframes shake /* Safari and Chrome */
{
0% { -webkit-transform: translate(2px, 1px) rotate(0deg); }
 10% { -webkit-transform: translate(-1px, -2px) rotate(-1deg); }
 20% { -webkit-transform: translate(-3px, 0px) rotate(1deg); }
 30% { -webkit-transform: translate(0px, 2px) rotate(0deg); }
 40% { -webkit-transform: translate(1px, -1px) rotate(1deg); }
 50% { -webkit-transform: translate(-1px, 2px) rotate(-1deg); }
 60% { -webkit-transform: translate(-3px, 1px) rotate(0deg); }
 70% { -webkit-transform: translate(2px, 1px) rotate(-1deg); }
 80% { -webkit-transform: translate(-1px, -1px) rotate(1deg); }
 90% { -webkit-transform: translate(2px, 2px) rotate(0deg); }
 100% { -webkit-transform: translate(1px, -2px) rotate(-1deg); }
}

Then dah paste, preview dulu kalau jadi save dulu ye..

Yang warna biru tu korang leh tukar ngan mana-mana background image yang korang suka :D

tutorial by Afiqah Junizan