Ana Sayfa Hakkımda Referanslar Site Tanıtımı Sosyal İmleme Seo Paketleri Reklam İletişim Destek Rastgele Yazı Oku

jQuery Responsive Tab Menü Yapımı

Merhaba arkadaşlar yepyeni bir uygulama yazısında tekrar karşınızdayım. Bu yazımda jQuery Responsive Tab Menü yapmayı anlatacağım. Bu uygulama daha önce birçok blog da var eski bir konu ama ben sizler için farklı kodlar ve css ile sizlere altın tepside sunmaya geldim. Bu uygulamamızda diğer örneklerden farklı bir işlem yaparak JQuery kullanacağız ve bunu yaparken de biraz abartıp tab menümüzü efekt uygulayacağız.

Halen tüm sitelerde aktif olarak kullanılmakta ve WordPress sitelerde bile bu uygulama kullanılmakta. Tab menü diye hor görmeyin tek bir tıkla bir çok işlemi içinde yapabilirsiniz. İçerikleriniz in hepsini sayfada göstermek istemeyebilirsiniz veya son eklenen haberleri, duyuruları, resimleri bile bu uygulama ile hızlı ve düzgün bir şekilde gösterebilirsiniz. Ana sayfa da ,içeriğe boğacak ve kullanıcının aradığını bulması çok zor olacak.

jQuery Responsive Tab Menü Yapımı

Kısaca Tab Menü uygulamasını açıklamak gerekirse, butona veya yazıya tıklanınca div içerisindeki içerik değişecek ve tıklanan butonun veya yazı ile alakalı içerik gelecek. Onlarca kod yazıp sayfada göster – gizle demektense bir düzen içinde işinizi daha temiz bir şekilde yapabilirsiniz. Şu anki uygulamada herhangi bir işlem olmayacak yani veri tabanından veri çekip listeleme işlemi yapmayacağız. Yapacağımız uygulamada sizin yapacağınız tek şey yazı ve buton içeriklerini kendinize göre düzenlemeniz. Bunun için biraz css bilgisi gerekecek eğer bilmiyorum diyorsanız araştırma hissiniz ile bunu başarabileceğinize eminim.

Öncelikle :

  • Javascript dosyalarını sayfamıza ekliyoruz.

  •  Daha sonra sayfamıza html kodları ekliyoruz.

  •  Son olarak ta css kodlarımızı tanımlıyoruz.

Uygulamayı JQuery kütüphanesini kullanarak kolayca yaptık. Eğer gerekli Javascript dosyalarını tanımlamasanız sayfada hatalı bir şekilde çalışacak. Yaptığımız uygulamanın çalıştığı tarayıcı ve desteklediği sürümler : Chrome, IE8+, FireFox, Opera, Safari dir. Gönlünüz rahat bir şekilde bu uygulamayı sayfanızın her yerinde kullanabilirsiniz .Uygulamamızın kısaca açıklamasını da yaparak bir yazının daha sonuna gelmiş olduk. Yararlı bir uygulama olması dileğiyle.

Not : Altta paylaştığım dosyada yan yana değilde alt alta , solda ve sağda olarak yapılan örnekleri de var isterseniz indirerek dosyayı inceleyebilirsiniz.

Yunus Emre Mert Tab Menü Uygulaması

Paylaşmak Güzeldir:

Tarih: 16 Şubat 2014   Yazar:   Kategori: jQuery   952 Okunma1 Yorum

Konuyla İlgili Benzer Yazılar

  • jQuery İle Input Mask Yapımı jQuery İle Input Mask Yapımı
    Merhaba arkadaşlar , Bir web sitesi yaptığınızı düşünün ve bu web sitesinde birden fazla form yaptığınızı da düşünürsek bu uygulama tam da size göre. Örneğin iletişim formu veya ... Yazıyı Oku
  • jQuery İle Haber Bandı Yapımı jQuery İle Haber Bandı Yapımı
    İyi akşamlar arkadaşlar, Bugün sizlerle beraber birçok haber sayfasında, blog sayfalarında veya e-ticaret sayfalarında ana sayfanın en üstünde gördüğünüz bandı WordPress altyapısı iç... Yazıyı Oku

Konuya Yapılan Yorumlar1 Yorum