| Üye Paneli | ||
Css ile Aktif Menü Buton Yapımı |
||
![]() Menülerimizi yaparken hep güzel bişey olsun isteriz Güzel olsunlarki ziyaretcilerimiz sitemizi beğensinler tabiki artık bir çok hazır menüler var bir çoğuda güzel tabi kendimizde bu şekilde güzel menüler oluşturabiliriz Forum Temada bu menüyü kullanmıştım ziyaret edenler bilir orada kullandığım menü butonlarının aynısını anlatıcam Tabi öncelikle bir grafik programı kullanmamız gerekiyor photoshop gibi hazırlamamız gereken butonların önce yüksekliğini ayarlamamız gerekli yani sitemizde kullanıcağımız yükseklik nekadar olmalı ve yüksekliğimiz çift rakam olmalı örnek 30 pixel burada ben örnek uygulamada 30 pixel kullandım elbette bu değiştirilebilir size kalmış tek rakam olmamasına dikkat edin. İlk olarak 30 pixel yüksekliğinde bir menümüz olacak ama biz butonu hazırlarken 60 pixel olarak çalışacağız yani 30 pixel normal görünüm 30 pixlde aktif görünüm örnek alttaki resim ![]() Resmimizi hazırladık şimdi kullanacağımız kodlara geçelim ilk olarak linklerinizi belirlemenizde yarar var linkleri belirlerken hepsine ayrı olarak birer class atıyoruz örnek <a href="#" class="ana_sayfa"></a> linklerimizi de hazırladık şimdi geçelim css kısmına ve ilk kodumuza .ana_sayfa { width: 120px; height: 30px; background: url(ana_sayfa.png) top left no-repeat; float: right } yukardaki kodumuzda genişlik ve yükseklik değeri verdik butonumuzu oluşturan arkapan resmi verdik ve sağa yasladık geçelim ikinci kodumuza a.ana_sayfa { display: block; width: 120px; height: 30px; background: url(ana_sayfa.png) top left no-repeat; text-decoration: none; } Yukarıda ki kodumuzda bir önceki kodda olmayan blok kodumuz var bu kod butonumuzun can damarı son kodumuza geçelim a:hover.ana_sayfa { background-position:0 -30px; text-decoration: none; } Son Kodumuzda arka plan resmimizi yukarı çektik butonumuzun üstüne gelince aktif olması için bu butonun diğer menülerden farkı aktif yani üsütne gelince tarayıcının tekrar resim yüklememesi zaten bir resimi iki kere kullanıyoruz sadece pozisyonları ile oynuyoruz o yüzden tarayıcı hem normal hemde aktif resimi yüklemiş oluyor Ve İE6 dahil denediğim butun tarayıcılarda sorunsuz çalışıyor Kolay gelsin sitelerinizin menülerinizi güzelleştirin Örnek Ön İzleme için Buraya Tıklayınız |
||
12 May 2012 21:59 44blackinci demiş ki: Webmaster, Ben daha önce bir defa mybb için ücretli tema hazırladım ama hiç satmadan tekrar ücretsiz olarak dağıttım şuan için soruyorsanız mybb yi bıraktım... başka bir forum sistmei ile ilgileniyorum. Kendiniz bir fiyat biçmek adına bilgi edinmek için soruyorsanız bu yaptığınız grafiklere, yazdığınız kodlara ve harcadığınız emeğe göre değişir ama şuan için ücretli tema yapmanızı tavsye etmem zira mybb nin vbulletin gibi ücretli olacağı dedikoduları dolaşıyor eğer bu gerçekleşirse işte ozaman güzel olur ve ücretli temaların önü açılmış olur ozaman daha rahat ve güvenilir tema hazırlayıp satabilirsiniz iyi günler. |
||||
11 May 2012 19:28 43Webmaster demiş ki: Merhabalar Blackinci MyBB temalarını ücretli olursa ne kadar ücrete hazırlıyorsunuz? Buradan belirtirseniz sevinirim İyi günler |
||||
30 Nisan 2012 23:35 42blackinci demiş ki: Kadir Kaya, Bedava forum sistemi sunun sitelerin sistemi nasıl işliyor bilemiyorum ama gözükmemesi normaldir bu tür siteler çok kısıtlı çalışırlar. |
||||
30 Nisan 2012 22:31 41Kadir Kaya demiş ki: Usta emeğine sağlık ama tr.gg sitelerinde ve jindo.com sitelerinde çalışmıyor hatta hiç gözükmüyor niye anlayamadım. |
||||
16 Mart 2012 20:06 40blackinci demiş ki: Time Traveler, Tanımlı class adına dikkat edin "ana_sayfa" oradaki kodları komple kopyalamayın orası sizi yanıltabilir |
||||
16 Mart 2012 16:50 39Time Traveler demiş ki: Sayın Blackinci ben bu menüyü mybb kurulu bir siteye eklemek istiyorum. Css kodlarını global.css'in en altına ekledim kaydettim. Daha sonra Ön izlemenize girdim ve ordaki koldarı kopyalayıp kodları Header şablonun en sonuna ekledim fakat olmadı. Nasıl yapabilirim ? |
||||
16 Aralık 2011 05:46 38AsparagasHaber.net demiş ki: İşime yaradı kullanacagım tesekkur ederım.. |
||||
22 Kasım 2011 22:43 37Agah demiş ki: ÇOOOOOOOOOOOOOKKK SAĞOLUN EMEĞİNİZE SAĞLIK!!!!!!!!!!! |
||||
2 Temmuz 2010 08:18 36Musty demiş ki: Çok teşekkür gayet sade ve anlaşılır. |
||||
| Son Yapılan 10 Yorum | ||
|
||
|
Yukarı
İletişim
RSS Takip
İstatistikler
Site İçeriği
Copyright © 2007 - 2011 DLE Blackinci Edition Seri 2 |