Eklenti, standart bir JavaScript dosyasında yazılmış yeniden kullanılabilir bir kod aracıdır. Bu dosyalar, jQuery çerçeve yöntemleriyle birlikte kullanılabilecek yararlı jQuery yöntemleri sağlar.
Bazı mevcut eklentileri ve bunların nasıl kullanılacağına dair örnekleri görelim
Eklenti Pagepilling veya Yığılmış Sayfa
PagePiling.js Bir web sitesinin bölümleri arasında, sanki bir menüde kayar gibi fare ile gezinerek, klavye oklarını kullanarak veya fare tekerleğini çevirerek, tüm bölümler aynı web sitesinde bulunan bir jQuery eklentisidir. Kaydırma dikeydir, bu nedenle sayfa yığılmıştır.
- Başlangıç
- Temary
- JQuery
Bu eğitimin amacı eklentileri sunmaktır.
JavaScript kitaplığından JQUERY
- 1 - jQuery'ye Giriş
- 2 - jQuery ile Temel Programlama
- 3 - jQuery ile Gelişmiş Efektler
Daha az yazmak ve daha fazlasını yapmak için bir JavaScript kitaplığı
ÖrnekYapılandırma, menünün kimliğini belirttiğimiz, ardından her bölümün adını belirttiğimiz, her bölüm için arka plan rengini belirttiğimiz ve ardından sağ navigasyonda görünecek adı belirttiğimiz pagepiling işlevini çağırarak yapılır.
$ ('# pagina'). pagepiling ({menu: '#menu', çapalar: ['start', 'section', 'sectionb'], SectionsColor: ['# 9aceed', '# 2ebe21', '# 2C3E50 '], gezinme: {' konum ':' sağ ',' araç ipuçları': ['Ana Sayfa', 'Bölüm A', 'Bölüm B']}Bölüm sınıfı, tarafından kullanılan sınıftır. JQuery eklentisi Her bölümü tanımak için, bir bölümün içeriğine başlamak için belirttiğimiz giriş sınıfıdır.
Listeleri sıralamak için sıralanabilir eklenti
Bu eklenti, fare ile sürükleyerek ve öğeleri değiştirerek listeleri yeniden sıralamak için çok kullanışlıdır. Wordpress cms, kategorileri, gönderileri ve sayfaları yeniden sıralamak için bu eklentiyi kullanır.
Bir örnek yapalım, bir başlangıç oyuncuları ve bir yedek takım listemiz olduğunu varsayalım, ayrıca bir yedek oyuncu listemiz de var. Bu üç listeyi oluşturacağız ve sortable eklentisi sayesinde, aynı liste içindeki konumunu değiştirmek veya yerleştirmek istediğimiz listeye fare ile isimlerini sürükleyerek basitçe liste oyuncularını değiştirebileceğiz.
jQuery Sıralanabilir - Oyuncu ListesijQuery Sortable - oyuncu takım sahibi
- Jose
- Alberto
- Charles
- Madde 4
- Javier
- çerçeveler
- Daniel
- Genaro
- Mario
- Fernan
- Sümbül
- manuel
- Silvano
Kendi jQuery eklentimi nasıl oluşturabilirim?
jQuery eklentisi, jQuery'nin bize sunduğu olanakları genişleterek veya kolaylaştırarak yeni bir işlevsellik oluşturmak için kullandığımız bir komut dosyası veya yeni bir yöntemdir. Bir eklenti oluşturmak için bir işlev bildirmeli ve işlevselliği programlamalıyız. herhangi bir sayfada veya web sitesinde yeniden kullanılabilecek şekilde genel biçimde.
Eklentimizi jQuery'ye eklerken, eklentimizin performansını değiştirebilecek başka herhangi bir kitaplık veya işlevle veya hatta css dosyalarıyla çakışma olmadığını analiz etmeli ve dikkate almalıyız. jQuery, eklentileri farklı şekillerde tanımlamamızı sağlar. Bir web sitesinin öğeleri, belge tarayıcıya tamamen yüklenene kadar güvenli bir şekilde değiştirilemez. jQuery, html öğelerine ne zaman erişilebileceğini belirlemek için bu durumu algılar.
.ready () olayı yalnızca web yüklendikten sonra ve tarayıcıda gösterilmeden önce yürütülür, .ready (), tüm HTML belgesini yükledikten hemen sonra kodumuzun yürütülmesini sağlayan bazı işlevleri yürütme amacına sahiptir. görüntülenen öğelerdir.
Bu işlevin biçimi:
// Bu işlevler, web'in yüklenmesi bittiğinde kullanılabilir olacak $ (belge) .ready (işlev () {işlevim () {// işlevin kodu}});Bir işlev yerine bir CSS seçici uygularsam. Bu satır, sayfanın yüklenmesi bittiğinde otomatik olarak yürütülecektir, örneğin sayfa yüklendikten sonra, tüm bağlantıları yeşil ve 14 piksel boyutunda koyun.
$ (belge) .ready (işlev () {$ ('a') css ({'renk': yeşil, 'yazı tipi boyutu': '14px'});});Ardından, bir web sitesindeki yorumlar listesinde yayınlanan herhangi bir postayı ortadan kaldıran bir eklenti oluşturacağız.
Kullanıcı yorumları |
Yorum Lorem Ipsum 1 - Cuma 01/04/2016 12:35 Lorem Ipsum, yazıcılardan ve metin dosyalarından basitçe sahte metindir. [email protected] |
Yorum Lorem Ipsum 2 - Cuma 01/04/2016 12:35 Lorem Ipsum, yazıcılardan ve metin dosyalarından basitçe sahte metindir. [email protected] |