Sunday, October 16, 2011

Tutorial >> Animation blockquote

Hi..

Now ! nak ajar pulak cara nak buat animation blockquotes !
cube tengok sini ye . .
ade tak rebbit pink bergerak ke tepi tu ? itulah animation blockquotes !
*
*
*
1. mcm biasa , Dashboard > design > edit html . ctrl+F untuk cari kod ni :

.post blockquote {
Ataupun ini
/* Headings
2. Jumpa tak ? kalau jumpa delete code lama..


(code yang dibawah blockquote smpai simbol } ) n replace dengan code ni :

background:url(URL BACKGROUND); padding:5px;
color: #996633;
border-left:2px solid #D0A9F5;
color: #996633;}
blockquote:hover {
background: url(URL ICON COMEL) no-repeat right bottom ;
-webkit-transition: 1s;}
}
Ataupun ini
blockquote:hover {

background-color: #F8FBFE;
-webkit-transition-duration: 3.5s;
background-image:url(http://dl4.glitter-graphics.net/pub/437/437984lwmc80u8xi.gif);
background-position:bottom right;
background-repeat:no-repeat;


URL BACKGROUND - untuk background kat blockquote korang . 
URL ICON COMEL - boleh cari kat SINI
1 - untuk masa animation korang tu bergerak dari kiri ke kanan . nak tukar ? boleh je .

3. Siap dah . cube preview dulu . kalau jadi save je la ye :)

Writer By at
Labels:

No comments:

Post a Comment