Sade bir şekilde download "Drop Down Tabs almak içindropdowntabs.zip", Tüm dosyaları ve beraberindeki 5 stil bu menü makyaj içerir. Başvuru için, bazı dosyalar zip içinde yer aşağıda gösterilmiştir:
dropdowntabsdemo.htm (demo sayfa, 5 Sekme Menü örneği gösteren)
dropdowntabfiles /dropdowntabs.js (core. js Drop Down Tabs komut dosyası için) dosyası
dropdowntabfiles /ddcolortabs.css (Örnek CSS 1 Örneğin menüsü stili için)
Özelleştirme
Ayarlama ve Sekmeler açılır özelleştirme çok, tüm menü gibi basit normal HTML ve CSS kullanarak tarz oluşur. Mantıken bunu aşağıdaki üç bölümden menü düşünmek mantıklı:
1) HTML menüsü sekmeleri için:
<div id = "bluemenu" class = "bluetabs">
<ul>
<li> <a href="http://www.dynamicdrive.com"> Anasayfa </ a> </ li>
<li> <a href = "http://www.dynamicdrive.com/style/" rel = "dropmenu1"> CSS </ a> </ li>
<li> <a href = "http://www.dynamicdrive.com/resources/" rel = "dropmenu2"> Ortaklar </ a> </ li>
<li> <a href="http://tools.dynamicdrive.com"> Araçları </ a> </ li>
</ ul>
</ div>
Gibi, menü sekmeleri olan sadece sıradan bir HTML listesini görebilirsiniz bir DIV içinde tamamladı. Bu DIV benzersiz bir kimlik ver sayfasında tanımlamak için kullanılacak. Keyfi sınıf öznitelik sekmeler için istenen tarzı sağlar. Şimdi, belirli bir sekme (zaman sekmesinin üzerine fare rulo), sadece kodu eklemek gösterilen menüyü bir damla taşıma belirtmek için rel = "unique_id içinde kendi <a> eleman, burada "unique_id"Bir numaranız Açılan menüden DIV sayfasında (aşağıya bakınız) göstermek için. Sekmeleri bir yere taşımaz "" rel öznitelik basit doğada tek düzeyde olacaktır.
2) HTML açılır menüsü için (ler):
Menüler istediğiniz sekmeleri yukarıdaki sayfasında bireysel DIV etiketleri olarak tanımlanmıştır ilişkili aşağı bırakın. Örneğin:
<! - 1. açılır menüden ->
<div id = "dropmenu1"Class =" dropmenudiv ">
<a href="http://www.cssdrive.com"> CSS Drive </ a>
<a href="http://www.javascriptkit.com"> JavaScript Kit </ a>
<a href="http://www.codingforums.com"> Kodlama Forumlar </ a>
<a href="http://www.javascriptkit.com/jsref/"> JavaScript Reference </ a>
</ div>
"
"Fark, her DIV o değeri ile eşleşen bir keyfi ama benzersiz bir kimlik özelliği taşır "" rel ilişkili olmaktır sekmesi içinde özniteliği. CSS sınıf adı ve stil sağlamak için sadece orada değiştirilebilir / istediğiniz gibi kaldırılır.
3) Her iki yukarıdaki için aşağıdaki HTML Sekme Menü örneğini başlatmak için aramak için Senaryo:
Son olarak, Sekmeler tanımlanmış bir açılır iki parçaları ile, sayfa üzerinde başlatmak için aşağıdaki komut araması gerekir:
<script type="text/javascript">
/ / SYNTAX: tabdropdown.init ( "", menu_id [integer OR "auto"])
tabdropdown.init ( "bluemenu", 0)
</ script>
Bir kez sayfa tamamen yüklendikten ilk parametresi (kırmızı) Menü Sekmesinin başlatmak için kimlik gerektiğini vurguladı. İkinci parametre, isteğe bağlıdır ve sekmesi varsayılan olarak seçilmelidir yapabilmenizi sağlar-ya bir tamsayı girin (0 = 1st sekmesi, 1 = 2 sekmesi vb), veya "otomatik"Komut dosyası otomatik olarak geçerli sayfa URL'sini *. maçlar sekmesini seçin deneyin ve that's it!
* Not "otomatik"Sekmesini seçin özelliği yukarıda bahsedilen ve gelişmemiş doğrudan seçerek veya tüm olanakları için burada iki URL aynı hesap olmaz sunucu tarafında sekmesi geçerli sayfaya karşılık geldiğini belirlemek için komut dosyası. Kullanarak yerine alacaktı değildir. Olarak kullanın kolaylık ve dönüş planı!
Css Yatay Menü
Normal
