« »
[Tutorial] Link Hover Shadow Effect
January 2, 2012 | 12:06 AM
2 chingu[s]





Request dari Lylla, she ask me cemana yana buat link jadi macam ada shadow tu. Okay, this is just a simple tuto. Blogskin users or any template from blogger.com users boleh guna. Just follow this step!^^ #Warning hard (amaran keras)! Just menjadi dalam Google Crome sahaja. Harap maklum :)

1. Blogger.com > Dashboard > Template > Edit HTML

2. Ctrl + F, search for this code :
a:hover {

3. Dah jumpa? Kat bawah tu ada code yang korang dah edit sebelum nie kan? Korang replace code tu dengan code nie :
color: transparent;
text-shadow: 10px 0px 1px #888;
-webkit-transition: .5s;
-moz-transition: .5s;
}

So, code korang akan jadi macam nie :
a:hover {
color: transparent;
text-shadow: 10px 0px 1px #888;
-webkit-transition: .5s;
-moz-transition: .5s;
}

#yang merah tu korang boleh pilih warna yang korang suka kat SINI
#yang purple tu korang boleh tukar. yang tu untuk shadow effect nanti. Kalau taknak tukar pun takpe^^

4. Then Save Template. Siap!^^

Lots of Love,
Yana♥

Labels: , , ,



2 Comments

Blogger lailaazhar said...

hohoho ^^
menjadi yeayyy , neway thanks kak yana sebab buat tuto nie :>

 
Blogger Chimi ♥ said...

sesame^^

 

Post a Comment

No harsh word here please. Thanks for the comments :)



|


Disclaimer



This blog belongs to me and me only. All items made by me unless stated in credit section below. No ripping, spamming and copying w/o my permission. Respect me and I'll respect you. Thank you :)






Credits


This template 100% made by me. Akira Himesama. With little help from my old skins and Dinamic Drive. For header and background, I used Photoshop CS5. Color got from HTML color code. Font from Dafont and Google Web Font. Gifs picture made by me and some taken from Tumblr. Other image get from We♥It, Google and Tumblr. Kindly inform me if I'm using your materials but i don't mention here. (c) Copyright by Akira Himesama. All right reserved 2012 (c)