İlan
Bu konudaki son derste Yeni Başlayanlar için jQuery eğitim dizisi, kısa bir bakacağız jQuery Kullanıcı Arayüzü - Web uygulamalarına grafik kullanıcı arabirimleri eklemek için en yaygın kullanılan jQuery eklentisi. Süslü formlardan ve görsel efektlerden sürüklenebilir widget'lara, döndürücülere ve iletişim kutularına - jQuery UI size zengin web arayüzleri oluşturma gücü verir.
Henüz yapmadıysanız, dizideki önceki makalelerimizi okuduğunuzdan emin olun:
- Giriş: jQuery nedir ve neden ilgilenmelisiniz? Web'i Etkileşimli Hale Getirme: jQuery'ye GirişjQuery, neredeyse her modern web sitesinin kullandığı bir istemci tarafı komut dosyası kitaplığıdır - web sitelerini etkileşimli hale getirir. Tek Javascript kütüphanesi değil, ancak en gelişmiş, en desteklenen ve en yaygın kullanılan kütüphanedir ... Daha fazla oku
- 1: Seçiciler ve Temel Bilgiler jQuery Eğitimi - Başlarken: Temel Bilgiler ve SeçicilerGeçen hafta, jQuery'nin herhangi bir modern web geliştiricisi için ne kadar önemli olduğunu ve neden harika olduğunu anlattım. Bu hafta, sanırım ellerimizi bir kodla kirletip nasıl öğrendiğimizi ... Daha fazla oku
- 2: Yöntemler JQuery'ye Giriş (Bölüm 2): Yöntemler ve İşlevlerBu, jQuery web programlama serisine devam eden yeni başlayanların bir parçasıdır. Bölüm 1, projenize ve seçicilerinize nasıl dahil edeceğinizin jQuery temellerini ele aldı. 2. bölümde, devam edeceğiz ... Daha fazla oku
- 3: Sayfa Yükleme ve Anonim İşlevleri Bekleme JQuery'ye Giriş (Bölüm 3): Sayfanın Yüklenmesini Bekleme ve Anonim İşlevlerjQuery, modern web geliştiricisi için tartışmasız önemli bir beceridir ve bu kısa mini dizide size kendi web projelerinizden yararlanmaya başlamanız için bilgi vermeyi umuyorum. İçinde... Daha fazla oku
- 4: Olaylar jQuery Eğitimi (Bölüm 4) - Olay DinleyicileriBugün bir çentik başlatacağız ve gerçekten jQuery'nin nerede parladığını göstereceğiz - olaylar. Geçmiş dersleri takip ettiyseniz, şimdi temel kodu oldukça iyi anlamanız gerekir ... Daha fazla oku
- Chrome Geliştirici Araçları ile hata ayıklama Chrome Geliştirici Araçları veya Firebug ile Web Sitesi Sorunlarını AnlamaŞimdiye kadar jQuery öğreticilerimi takip ettiyseniz, bazı kod sorunlarıyla zaten karşılaşmış olabilirsiniz ve bunları nasıl çözeceğinizi bilmiyor olabilirsiniz. İşlevsel olmayan bir kod parçasıyla karşılaştığında, çok ... Daha fazla oku
- 5: AJAX jQuery Eğitimi (Bölüm 5): AJAX Hepsini!JQuery mini eğitim serimizin sonuna yaklaştıkça, jQuery'nin en çok kullanılan özelliklerinden birine daha ayrıntılı bir şekilde bakmamızın zamanı geldi. AJAX bir web sitesinin iletişim kurmasını sağlar ... Daha fazla oku
JQuery UI nedir ve neden kullanmalıyım?
jQuery UI, bir GUI ile modern bir web uygulaması için gerekli tüm bileşenleri sunar. Daha iyi bir açıklama istemek için, bir widget koleksiyonudur.
Bununla neler yapabileceğiniz hakkında hızlı bir fikir edinmek için MakeUseOf'a göz atın. Bizimkilerde, içerik aslında sadece ayrı div'ler dizine eklenecek sıralanmamış bir listeyle. Üzerinde jQuery sekmeleri işlevini çalıştırın ve sihirli bir şekilde sekmelere dönüşürler. Müthiş! İsterseniz AJAX aracılığıyla sekme içeriği bile yükleyebilirsiniz.
Ödüller sayfası, kullanıcı işlemlerini onaylamak ve iletileri döndürmek için bir "kalıcı açılır pencere" iletişim kutusu da kullanır. Kullanıcının dikkatini odaklamak için iletişim kutusunun etkileşim bitene kadar sayfa içeriğinin geri kalanını karartmasını sağlayabilirsiniz.
Yanıtlar sitemizde, basit ipucu özelliği, düğmelerle ilgili ipuçları sağlar.
jQuery UI, formlar söz konusu olduğunda gerçekten mükemmeldir ve çok sayıda kaydırıcıya ve seçicilere erişim sağlar. Ben büyük bir hayranıyım datepicker kullanıcının tarih yazması gereken normal bir metin giriş kutusunun üzerine yükleyebilirsiniz.
Karmaşık görünüyor değil mi? Saf JavaScript'te böyle bir şey kodladığınızı hayal edebiliyor musunuz? JQuery UI ile şu şekilde yapabilirsiniz:
$ ( "# DateField") datepicker ().;
Bunun ne kadar harika olduğunu açıklamak için daha fazla zaman harcamayacağım çünkü jQuery UI resmi demoları basit kod örneklerinin yanı sıra mevcut tüm özelliklere iyi bir genel bakış sunar. Git oku.
JQuery kullanıcı arayüzü ekleme
JQuery UI'yi kullanmaya başlamanın en basit yolu, başlığınıza aşağıdaki satırları eklemektir - ancak jQuery UI, jQuery'nin önceden yüklenmesini gerektirdiğinden, bunların ana jQuery referansından SONRA eklendiğinden emin olun. Hem eklenti komut dosyasına bir başvuruya hem de stil bu kullanıcı arayüzü öğelerinin görsel açıklamasını içerir.