JQuery kütüphanesi; web programlama için genel amaçlı ara bir katman oluşturur. Bu katman sayesinde neredeyse her türlü duruma uyan scriptler yazabiliriz. JQuery kütüphanesinin genişleyebilir bir yapısı vardır. Üzerine plug-in ler yazılabilir. İnternet üzerinde ve official sitesinde yazılmış plug-in lere kolayca ulaşabilirsiniz. Hatta kendi plug-in inizi bile yazabilirsiniz.

İşte JQuery' nin kabiliyetlerinden bazıları:

1. Sayfa Elemanlarına Ulaşım : JavaScript kütüphanesi olmadan DOM (Document Object Model) ağacı üzerinde veya HTML dökümanı üzerinde işlem yapmak için satırlarca kod yazmamız gerekir. JQuery tam da burada hızlı ve etkili bir çözümü olan "Seçiciler" (Selectors) mekanizmasını sunar. Seçiciler mekanizması ile HTML elementlerine hızlı ve kolay bir şekilde ulaşabiliriz.

2. Sayfa Görünümünü Değiştirme : CSS sayfa stilleme işinde inanılmaz ve güçlü metodlar sunar. Fakat tarayıcıların tüm standartları desteklemediği zamanlarda CSS de yetersiz kalır. CSS in yarattığı bu boşluğu JQuery, tüm tarayıcıların desteklediği standartlarıyla gayet güzel bir şekilde doldurur. Buna ek olarak, sayfamız render edildikten sonra JQuery ile CSS classlarını ve inline yazılmış style ları değiştirebiliriz.

3. Sayfa İçeriğini Değiştirme : JQuery nin sayfa üzerinde yapabildikleri sadece class ve style değiştirmekle sınırlı değil. JQuery ile bir kaç tuşla sayfamızda istediğimiz içeriği de değiştirebiliriz. Sayfamızdaki yazıları değiştirebiliriz. İstediğimiz yere yeni HTML elementleri insert edebiliriz, imajları değiştirebiliriz, elementlerimizin yerini değiştirebiliriz, hatta sayfamızdan eleman bile kaldırabiliriz.

4. Sayfa Animasyonları : Sayfamızdaki kontrollere fadeIn, fadeOut veya wipe efektleri verebiliriz.

5. Sayfa yenilemesi olmadan Sunucudan veri alma : Diğer bir deyişle AJAX (Asynchronous Javascript and XML) işlemleri yapabiliriz.

6. Genel JavaScript işlerini basitleştirme : Javacsript ile sıklıkla yaptığımız işleri (döngüler, dizi işlemleri vb.) daha basite indirger.

Bu saydığımız maddeler dışında tabiki onlarca özellik sayılabilir. JQuery denizine girdikçe görebileceğimiz bir çok özellik mevcut. Özellikle giriş bölümünde bahsettiğimiz plug-in olayı zaten başlı başına bir derya. Bu plug-in ler bizim hayal gücümüzle sınırlı sadece. Başka bir sınırı yok.

Şimdili bu kadar, diğer yazılarda görüşmek üzere

AJAX Tab Control görünüm olarak yeterli bence, ancak bazı durumlarda ihtiyaçlarımızı karşılamayabilir. İhtiyaçlarımızı karşılamadığı durumlarda tabiki kendi stillerimizi kontrole uygulayarak istediğimiz görünümü sağlayabiliriz. Bunun için CSS in nimetlerinden faydalanacağız.

Bu adresten CSS class detaylarına ulaşabilirsiniz. Bu CSS sınıflarını aşağıda kısaca açıkalayacağım;

CSS class larınındaki outher, inner ve tab kelimelerini aşağıdaki gibi simüle edebiliriz. Aşağıdaki resmi Tab kontrolünün bir tab' ı şeklinde düşünebilirsiniz.

header, inner ve tab  kelimelerinin hiyerarşik yapısı da aşağıdaki gibidir.

<span id="..." class="ajax__tab_active"> 
   <span class="ajax__tab_outer"> 
     <span class="ajax__tab_inner"> 
       <span id="..." class="ajax__tab_tab">Tab Text</span> 
    </span>
   </span>
</span>

 Bu kısa bilgiden sonra aşağıdaki örnek üygulamada gösterildiği gibi CSS class larını TabControl e uygulayabiliriz. Aşağıdaki örnek uygulama için ilgili imajları da almanız gerekmektedir.

İmajlar:

Örnek Kodlar: