1 / 19

JQUERY GİRİŞ

JQUERY GİRİŞ. JQUERY NEDİR?. JQuery aslında bir JavaScript kütüphanesidir.

julie
Download Presentation

JQUERY GİRİŞ

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. JQUERY GİRİŞ

  2. JQUERY NEDİR? • JQuery aslında bir JavaScript kütüphanesidir. • HTML dokümanların yönetiminde, animasyon oluşturumunda, etkileşimli sayfaların hazırlanmasında kullanılan daha az kodla, daha efektif daha çok işlerin yapılmasını sağlayan bir WEB etkileşimi sağlayan JavaScript kütüphanesidir.

  3. JQuery uygulamalarından faydalanmak, uygulama geliştirmek için öncelikle bu sistemin mevcut kütüphane dosyasını oluşturacağımız HTML dokümanlara eklememiz gerekir.

  4. Yani şöyle düşünün, siz bir uygulama geliştireceksiniz, ancak bu uygulamanın bir kütüphaneden, bir veri bankasından bir takım bilgileri alması gerek. İşte bu noktada JQuery kütüphanesi mutlaka HTML dokümanlarımızda referans olarak gösterilmek zorundadır.

  5. Bu dosyaları indirebileceğiniz site resmi JQuery sitesi olan aşağıdaki linkte. Ayrıca bu site üzerinde bir çok JQuery uygulama örneğini de inceleyebilirsiniz. • http://jquery.com/

  6. Kimler JQUERY KULLANIYOR? • Google, Dell, Bank of America ve Wordpress gibi ünlü markalar JQuery kütüphanesini kullanıyor. 

  7. JQUERY ÖĞRENMEK İÇİN 5 NEDEN?

  8. 1. GÜNÜMÜZÜN WEB TRENDİ • Jquery son zamanlarda oldukça meşhur. Web sitelerinde bu kadar çok kullanılması ile birlikte bir süredir kendi modasını oluşturdu.  • Bununla birlikte, yeni nesil web tasarımcı olmanın temel prensibinin de web trendlerini takip etmek olduğunu göz önünde bulundurduğumuzda, kendi projelerimizde Jquery kullanmak şart oldu. Çünkü web sitesi yaptırmak isteyen müşteriler, her zaman yenilikleri takip eden ve kendini yenileyen tasarımcıları tercih ederler.

  9.  http://www.defenderturk.com/ • Siz de bu tarz efektleri sitenizde kullanmak için sıfırdan Jquery yazmayı öğrenmek zorunda değilsiniz. Sadece hazır Jquery eklentisinin html yapısına nasıl eklendiğini öğrenmeniz yeterli olacaktır.

  10. 2. CSS’e uyumlu yapısı ile tasarımcı dostu • Jquery’nin, uzun bir süredir hayatımızda olan CSS ve yeni yeni kullanmaya başladığımız CSS 3 ile uyumlu yapısı, sitelerimizde kullanırken önemli bir avantaj sunuyor bize. Navigasyon menü, resim galerisi gibi bölümlere, hiç zorlanmadan ve fazla zaman kaybı yaşamadan Jquery efektleri ekleyebiliyorsunuz.

  11. Özellikle de CSS 3 ile birlikte gelen transitionvetransform özelliklerinin Jquery ile birlikte kullanılmasıyla, muhteşem çalışmalar çıkıyor ortaya. CSS 3′ün yeni özelliklerinden dolayı bir çoğu şimdilik sadece yeni nesil tarayıcılar tarafından sorunsuz görüntülenebilse de sonuç ortada.

  12. Aşağıdaki linke tıklayarak, basit bir butonu Jquery ile ne denli etkileyici yapabileceğinizi görebilirsiniz. (Firefox, Safari veya GoogleChrome kullanın) • http://www.tympanus.net/Tutorials/SlideOutButton/

  13. 3. Jqueryile Flash zahmetine son • Özellikle slaytlı resim galerilerinde flash tek çaremizdi ve bu da benim için fazladan harcanan zaman ve emek demekti. Jquery ile birlikte, sitenize aynen Flash ile yapılmış gibi görünen animasyonlu menüler, resim galerileri, mesaj pencereleri ve daha bir çok efekti Flash kadar zaman ve emek harcamadan eklemeniz mümkün.

  14. Sonuç olarak, müşterilerinizi arayüz tasarımı haricinde de görsel olarak etkilemek için elinize fazladan bir koz daha geçmiş olur. • Çünkü onlar arayüz tasarım örneğini gördüklerinde sitedeki hareketli bölümlerin nasıl görüneceğini tahmin edemeyebilirler. Böylelikle, tarayıcı testi aşamasında onları şaşırtabilir ve sonuçtan daha fazla memnun edebilirsiniz. Aşağıdaki resme tıklayarak, Jquery ile hazırlanmış bir navigasyon menü örneğini inceleyin ve kararı kendiniz verin. 

  15. http://www.tympanus.net/Tutorials/FancyAppleStyleNavigation/ • http://www.ozdtasarim.com/blog/css3-jquery-uygulamalari.html

  16. 4. Siteye ekleme ve düzenleme kolaylığı • Jquery size, sade ve basit mantığı ile hem sitenize ekleme kolaylığı hem de hazır eklentiler üzerinde istediğiniz değişikliği çok kolay bir şekilde yapma imkanı verir. Yapısı gerçekten o kadar sade ve basittir ki siteye sadece tek bir satırla ekleyebilirsiniz. Ayrıca istediğiniz düzenleme için hangi bölümü değiştirmeniz gerektiğini bir bakışta anlarsınız.

  17. Tasarımcılar için bu özelliğin ne kadar önemli olduğunu söylemeye gerek yok herhalde. Zaten sloganı “Writeless, do more” olan Jquery’den de bu beklendirdi.

  18. 5. Daha az boyut ile hızlı yükleme • Sıkıştırılmış hali ile sadece 25 KB civarında yer kaplaması, hem tarayıcı hem de bant genişliği açısından oldukça kullanışlı olduğunun bir göstergesi. Ayrıca Jquery’i sitenize Google üzerinden eklediğinizde bant genişliği konusundaki sorununuz da ortadan kalkmış oluyor. Jquery’nin mevcut son sürümünü Google üzerinden sitenize eklemek için aşağıdaki satırı html kodlarına eklemeniz yeterli oluyor.

  19. <scriptsrc="http://code.jquery.com/jquery-1.9.1.min.js"></script><scriptsrc="http://code.jquery.com/jquery-1.9.1.min.js"></script>

More Related