December 3, 2013

Tutorial : Link Hover Rainbow

Sebelum masuk tidor iqa nak buat tuto kecil-kecilan sikit. huhuhu. maklum lah setakat yang mampu jer :) Agak bosan so nak buat tuto senang nie lah . Hee~~ Tuto nie iqa pernah gune jgk dekat blog dlu.

Blogskin :-

1. Pergi dekat Dashboard -> Template

2. Tekan ctrl + f serentak dan cari kod a:hover{

3. Copy kod kat bawah nie :-

-webkit-background-clip: text;
color: white;
-webkit-text-fill-color: transparent;
background-image:-webkit-gradient(linear, left top, right top, from(#ea8711), to(#d96363));
background-image:-webkit-linear-gradient(left, #ea8711, #d96363, #73a6df, #9085fb, #52ca79);
background-image:-moz-linear-gradient(left, #ea8711, #d96363, #73a6df, #9085fb, #52ca79);
background-image:-ms-linear-gradient(left, #ea8711, #d96363, #73a6df, #9085fb, #52ca79);
background-image:-o-linear-gradient(left, #ea8711, #d96363, #73a6df, #9085fb, #52ca79);
}
4. Dan pastekan dekat bawah kod a:hover{

5.Preview & save :D

TAMPLATE DESIGNER :-

1. Pergi dekat Dashboard -> Design -> Edit html

2. Tekan ctrl + f serentak dan cari kod ]]></b:skin>

3. Copy kod kat bawah nie

a:hover{
-webkit-background-clip: text;
color: white;
-webkit-text-fill-color: transparent;
background-image:-webkit-gradient(linear, left top, right top, from(#ea8711), to(#d96363));
background-image:-webkit-linear-gradient(left, #ea8711, #d96363, #73a6df, #9085fb, #52ca79);
background-image:-moz-linear-gradient(left, #ea8711, #d96363, #73a6df, #9085fb, #52ca79);
background-image:-ms-linear-gradient(left, #ea8711, #d96363, #73a6df, #9085fb, #52ca79);
background-image:-o-linear-gradient(left, #ea8711, #d96363, #73a6df, #9085fb, #52ca79);
}

4. Pastekan di  bawah kod tadi / kalau tak boleh jgk pastekan dekat atas pulak

5. Preview & save :D

No comments:

Post a Comment

Thanks for leave your comments :D