link

SPRY Menü Yapımı?

Dreamweaver-SPRY-Menü_emresupcinHerkese iyi pazarlar arkadaşlar,

 

Bu dersimizde Dreamweaver konusu olan SPRY Menü’nün nasıl yapıldığını sizlere anlatacağım. Blogumu takip edenler sizde bilirsiniz ki SPRY Menü üzerinde çok durdum ama çoğu ziyaretçimizin bu konu üzerinde bayağı sıkıntısı var.

 

O yüzden en detaylı şekilde görsellerle birlikte bu dersimizde SPRY Menü’yü yapacağız.

 

Yeni açılan veya var olan HTML sayfasında istenen yere spry menü çubuğundan:

 

*** Yatay veya Dikey olarak seçilen menü eklenir.

 

SPRY-Menü-Yapımı1_emresupcin

*** Ana menü ve alt menüler düzenlendikten sonra;

SPRY-Menü-Yapımı2_emresupcin

Öncelikle menü üzerine gelindiğinde renk değişimi yerine image değişimi isteniyorsa image olarak kullanılacak 2 adet resim veya butonlar hazırlanmalıdır.

İmage değişimi istenmiyorsa aşağıdaki maddelerde image yerine background rengi değişik olarak seçmek tererlidir.

 

Dreamweaver de açılan bir html sayfası kaydedilir ve üst menülerden spry menüsünden spry menü çubuğu seçilir, menünün yatay veya dikey olarak kararlaştırılmasından sonra menünün seçenekleri ve alt seçenekleri düzenlenir. Sağ tarafta bulunan yan menülerden css stilleri çift tıklanır;

 

1 – Alt elemansız menü başlığı için image: ulMenuBarHorizontal a stil özelliğinden background image kısmından

 

SPRY-Menü-Yapımı3_emresupcin

2- Alt elemanlı menü başlığı için image: ulMenuBarHorizontal a.MenuBarItemSubMenu stil özelliğinden background image kısmından resim seçilip repeat özelliği uygulanır. ve X ve Y pozisyonları sıfırlanmalıdır.

3. Alt elemanlı menünün alt elemanları için image: ulMenuBarHorizontal a.MenuBarSubItemMenuHover stil özelliğinden background image kısmından resim seçilip repeat özelliği uygulanır ve X ve Y pozisyonları sıfırlanmalıdır.

4. Alt elemanlı menünün 1. alt elemanı için image: ulMenuBarHorizontal a.MenuBarSubItemMenu stil özelliğinden background image kısmından resim seçilip repeat özelliği uygulanır ve X ve Y pozisyonları sıfırlanmalıdır.

SPRY-Menü-Yapımı4_emresupcin

5. Mouse üzerine gelince image değişmesi için hover özelliği olan bütün stil özelliklerinin background image’sine 2. imageyi eklemek gerekiyor ekleme sırasında repeat özelliği açılıp X ve Y pozisyonları sıfırlanmalıdır

Yazar
Yazar
Bilgisayar Programcısı, Web Tasarımcı, Üniversite Öğrencisi...
Twitter Facebook Google Linkedin Flickr YouTube

Önceki Yazı:Bilgisayar Kullanıcılarına Önemli Uyarı!

Sonraki Yazı:Trigger ile Silinen Bilgileri Başka Tabloda Nasıl Tutulur?

YORUMLAR

Bu yazıya 2 yorum yapılmış.

  1. Yazar
    Mert

    Teşekkürler…

  2. Yazar
    İbrahim

    Hocam ben spry menü’yü sağ menü ye yaptım ancak resimde olduğu gibi menünün içindekiler sağ tarafa değil alt tarafa doğru sıralanıyor büyük ihtimalle right şeklinde kod yazıcam ama nereye yazıcam yardımcı olursanız sevinirim.

SİZ DE CEVAP YAZABİLİRSİNİZ
Bu yazı hakkında görüşünüzü belirtin.

ES Web Tasarım Web Tasarım Blog Teması Emre Supçin Bu tema ES Web Tasarım tarafından düzenlenmiştir. Hiçbir şekilde kopyalanamaz.