Drop Down ve DDTabs Menuler. Sitelerinize Şık Css menuler

Konu Görünümü | Doğrusal Görünüm

Drop Down ve DDTabs Menuler. Sitelerinize Şık Css menuler

Yazar

Mesaj

bykaradag
Administrator

Mesajlar: 12,108
Grup Administrators
Katılım: Mar 2008
Durum: Çevrimdışı
Rep Gücü:

Teşekkür Etti 13
7 Mesajında 7 Teşekkür Aldı
Açtigi Toplam Konu: 5139

Mesaj: #1

Drop Down ve DDTabs Menuler. Sitelerinize Şık Css menuler

Dynamicdrive sitesinde uzun zaman önce gördügüm ve bazı sitelerde uyguladıgım menuleri sizlerlede paylasmak istedim. bu sitede buna benzer bir cok menu ve sitenize ekleyebileceginiz kodları bulabilirsiniz. 
 
Örnekleri görmek isterseniz drop down menuler ve DD tabs menuler sayfalardan menuleri ve farklı şekillerini de inceleyebilirsiniz. 
[attachment=1165][attachment=1166] 
 
 
 
Drop Down Tabs menuyu sitenize eklemek isterseniz: 
Menulerinize alt menuler ekleyebilirsiniz. 
dropdowntabs.js Javascripti bilgisayarınıza kaydedin ve Ftp den sitenizin kurulu oldugu anadizine atınız 
ddcolortabs.css Css kodunu bilgisayarınıza kaydedin ve Ftp den sitenizin kurulu oldugu anadizine atınız 
"dropdowntabs.zip" Dosyasınıda indirerek resimleri ve örnekleri inceleyebilirsiniz. 
 
Admin Paneli :: Kalıplar :: Headerinclude kalıbında en alta ekleyiniz 
 
Kod: 
&lt;script type="text/javascript" src="dropdowntabs.js"> 
/*********************************************** 
* Drop Down Tabs Menu- © Dynamic Drive DHTML code library (Sitemize Uye Olmadan Linkleri Goremezsiniz. Lutfen Giris Yapin veya Kayit Olun..) 
* This notice MUST stay intact for legal use 
* Visit Dynamic Drive at Sitemize Uye Olmadan Linkleri Goremezsiniz. Lutfen Giris Yapin veya Kayit Olun.. for full source code 
***********************************************/ 
</script> 
 
<link rel="stylesheet" type="text/css" href="ddcolortabs.css" /> 
&lt;script type="text/javascript"> 
//SYNTAX: tabdropdown.init("menu_id", [integer OR "auto"]) 
tabdropdown.init("colortab", 3) 
</script> 
 
Admin Paneli :: Kalıplar :: Header kalıplarına menunuzu eklemek için: 
 
Kod: 
<div id="bluemenu" class="bluetabs"> 
<ul> 
<li><a href="http://www.mybbdestek.com">Anasayfa</a></li> 
<li><a href="http://www.mybbdestek.com" rel="dropmenu1">Forum</a></li> 
<li><a href="www.mybbdestek.com" rel="dropmenu2">Portal</a></li> 
<li><a href="www.mybbdestek.com">Araçlar</a></li> 
</ul> 
</div> 
 
 
Kodlarını ekleyiniz. Ve açılan menulerinizi belirlemek için bu kodların altına: 
 
Kod: 
&lt;!--1. menu için Dropdown menu --&gt; 
<div id="dropmenu1" class="dropmenudiv"> 
<a href="http://www.mybbdestek.com">Tanışma</a> 
<a href="http://www.www.mybbdestek.com">Genel forum</a> 
<a href="http://www.www.mybbdestek.com">Eğlence bölümü</a> 
<a href="http://www.www.mybbdestek.com">Spor bölümü</a> 
</div> 
&lt;!--2. menu için Dropdown menu --&gt; 
<div id="dropmenu1" class="dropmenudiv"> 
<a href="http://www.mybbdestek.com">Arama</a> 
<a href="http://www.www.mybbdestek.com">Üyeler</a> 
<a href="http://www.www.mybbdestek.com">Yönetim</a> 
<a href="http://www.www.mybbdestek.com">İstatistikler</a> 
</div> 
 
Şeklinde ayarlayabilirsiniz. Diğer Linklerinizede menu şeklinde linkler eklemek istiyorsanız rel="dropmenu3" gibi rel kodu ekleyerek belirtebilirsiniz ve onlar içinde ek olarak ustteki gibi kodlarla belirleyebilirsiniz. 
Yapımcının Örnek kodlamasını incelemek isterseniz tıklayınız 
Ve menunuz Örnek sayfa'daki gibi olacaktır. 
 
 
DD Tab Menu olarak sitenize eklemek isterseniz 
Menulerinizin altında açıklama ekleyebilirsiniz. 
ddtabmenu.js Javascript kodunu bilgisayarınıza kaydedin ve Ftp den sitenizin kurulu oldugu anadizine atınız 
ddtabmenu.css Css kodunu bilgisayarınıza kaydedin ve Ftp den sitenizin kurulu oldugu anadizine atınız 
"ddtabmenu.zip" dosyasınıda indirerek resim ve örnekleri inceleyebilirsiniz 
Admin Paneli :: Kalıplar :: Headerinclude kalıbında en alta ekleyiniz 
 
Kod: 
<script type="text/javascript" src="ddtabmenu.js"&gt; 
/*********************************************** 
* DD Tab Menu script- © Dynamic Drive DHTML code library (Sitemize Uye Olmadan Linkleri Goremezsiniz. Lutfen Giris Yapin veya Kayit Olun..) 
* This notice MUST stay intact for legal use 
* Visit Dynamic Drive at Sitemize Uye Olmadan Linkleri Goremezsiniz. Lutfen Giris Yapin veya Kayit Olun.. for full source code 
***********************************************/ 
&lt;/script> 
 
<link rel="stylesheet" type="text/css" href="ddtabmenu.css" /> 
<script type="text/javascript"&gt; 
//SYNTAX: ddtabmenu.definemenu("tab_menu_id", integer OR "auto") 
ddtabmenu.definemenu("ddtabs1", 0) //initialize Tab Menu #1 with 1st tab selected 
&lt;/script> 
 
Admin Paneli :: Kalıplar :: Header kalıplarına menunuzu eklemek için: 
 
Kod: 
<div id="ddtabs1" class="basictab"> 
<ul> 
<li><a href="http://www.dynamicdrive.com" rel="sc1">Home</a></li> 
<li><a href="http://www.dynamicdrive.com/new.htm" rel="sc2">DHTML</a></li> 
<li><a href="http://www.dynamicdrive.com/style/" rel="sc3">CSS</a></li> 
<li><a href="http://www.dynamicdrive.com/forums/">Forums</a></li> 
<li><a href="http://tools.dynamicdrive.com/imageoptimizer/">Gif Optimizer</a></li> 
</ul> 
</div> 
 
kodlarını ekleyiniz. Linklerinize acıklama eklemek için gerekli olan kodlar asagıdaki örnekteki gibidir. 
 
Kod: 
<DIV class="tabcontainer"> 
 
<div id="sc1" class="tabcontent"> 
Link hakkındaki açıklamak istedikleriniz 
</div> 
 
<div id="sc2" class="tabcontent"> 
Link hakkındaki açıklamak istedikleriniz 
</div> 
 
<div id="sc3" class="tabcontent"> 
Link hakkındaki açıklamak istedikleriniz 
</div&gt; 
 
</DIV&gt; 
 
Yapımcının Örnek kodlamasını incelemek isterseniz tıklayınız 
Ve menunuz Örnek sayfa'daki gibi olacaktır. 
 
Bu ve buna benzer çok orjinal menuler hazırlamak tabikide sizin elinizde. resimleri ve kodlamada kullanılan renk kodlarınıda değiştirerekde kendinize özel menuler hazırlayabilirsiniz. 
 
Şimdiden tüm çalışmalarınızda başarılar dilerim.

Posted on Wed, 16 Jul 2008 15:40:51 +0200 at Sitemize Uye Olmadan Linkleri Goremezsiniz. Lutfen Giris Yapin veya Kayit Olun..

07-16-2008 06:55 PM

« Önceki | Sonraki »

Yazdırılabilir Bir Sürümü Görüntüle
Bu Konuyu Bir Arkadaşına Gönder
Bu Konuya Üye Ol | Bu Konuyu Favorilerime Ekle

Forumlar Arası Geçişi