Baz? flash tasar?m?na sahip sitelerde görmü?üzdür, linkleri daha görsel hale getirmek de isteriz hali ile. Daha önceki bir yaz?mda ba?lant?lara simge ekleyerek kullan?c?lar? ba?lant? hakk?nda bilgilendirebiliyorduk. Yine buna benzer bir örnek ile dilersek kendi iste?imize uygun ve istedi?imiz görsellikte ba?lant?lar olu?turabiliriz.
Bunun için yapmam?z gereken bir animasyon olu?turmaya imkan veren görüntü i?leme program? ile (photoshop, fireworks vb.) iste?imize uygun bir imaj yaratmak. Ben fazla u?ra?madan örnek olmas? dolay?s? ile yandaki hareketli imaj? olu?turdum.
Bu imaj?n özelli?i ardarda eklenen layerlarla olu?turulmu? ve tekrars?z olmas?d?r. Bu ?ekilde ba?lant?n?n üzerine gelindi?inde css sat?r?m?zda yer alan background olarak belirtti?imiz bu imaj? görüntüleye?iz. (not: imaj?n png kayna?? için t?klay?n?z)
?imdi imaj?m?z? bir kaç sat?rl?k kod ile nas?l görüntüleyebilece?imize geçelim.
<style>
a{padding: 3px; font-family:Verdana, Arial, Helvetica, sans-serif; color:#333333; font-size: 8pt; border-bottom: 1px solid #993300; text-decoration: none;}
a:hover{ background: url(layer.gif) repeat-y;color:#CCCCCC;}
</style>
Güle güle kullan?n :)
Last 5 posts in Yazı
- Markalarla Bir Hafta - June 23rd, 2008
- 3Jam, Kısa Mesaj Servisi - June 19th, 2008
- Anlık Notlar, Fikirler, Listeler... - June 19th, 2008
- Bu Hafta Olanlar - 3 - June 13th, 2008
- Portfolio: Ryohei Hase - June 13th, 2008
