Öncelikle 4 satır ve 1 sütundan oluşan aşağıdaki koddaki gibi bir tablo oluşturalım. (Renkler be border üzellikleri sizin hayal gücünüze kalmış ;)


Şimdi oluşturduğumuz tabloyu ufak eklentilerle şık bir menü halne getireceğiz. Kullanacağımız
kodlar ufak fakat büyük ölçüde görsel zenginlik katıyor

<b>Eklenecek kodlar</b>

this.style.background='#CCCCCC' // bu kod nesnelerin(tablo,satır,sütun gibi) onmouseover,onmouseout,onclick,vb.. olaylarına yazır ve eklenen nesnenin arka plan rengini belirtilen renge ve olaya göre değiştirir.

parent.location='index.php' // nesnenin onclick olayına eklendiğinde o nesneye mouse ile clicklendiği zaman tırnaklar arasındaki sayfa ile köprü(link) kurar.

this.style.cursor = 'hand' //nesnenein onmouseover olayına eklendiğinde imlecimizi o nesnenin üzerine getirdiğimiz zaman imlecimizin şeklini <b>"el"</b> şekline getirir. Şimdide bu kodların nasıl eklendiğini bakalım.



Yukarıda ki kodda bu kodlarımız "td" tagımızın olaylarını ekledik tablomuz tek sütündan oluştuğu için "td" dağına eklememiz yeterli oldu. Tablomuz iki sütundan oluşmuş olsaydı kodlarımız "tr" tagına elememiz daha mantıklı olururdu.

Böylece basit bir html menü hazırlamış olduk. Bu menüyü 2 sütun halinde yapıp ilk satıra ufak imler koyarak dah şık bir hale getirebiliriz.

Ziyaretçi olarak yorum yazamazsınız. Üye olmak için tıklayın Üye iseniz giriş yapın.