Video: PHP Ders 5 - Jquery Dosyasını Sayfaya Dahil Etmek 2024
jQuery UI kodunu yazmak zor değildir, ancak kitaplığın doğru kısımlarını elde etmek HTML5 ve CSS3 programcıları için biraz kafa karıştırıcı olabilir. JQuery UI kitaplığı, standart jQuery paketinden çok daha büyüktür, bu yüzden ihtiyacınız yoksa her şeyi eklemek istemeyebilirsiniz.
Önceki jQuery UI sürümleri, paketin tamamını indirmenize izin verdi, ancak çeşitli öğelerin her birini ayrı bir JavaScript dosyasında depolandı. Çeşitli öğeleri yerine getirmek için aktif olan yarım düzine farklı komut dosyası etiketinin olması yaygın birşeydi.
Daha da kötüsü, bazı bağımlılık sorunları vardı, bu yüzden diğer paketleri kullanmadan önce belirli paketlerin yüklü olduğundan emin olmanız gerekiyordu. Bu, basit bir kütüphaneyi aslında kullanması oldukça karmaşık yaptı.
Neyse ki, jQuery UI'nın en yeni sürümleri bu işlemi oldukça basitleştirir:
-
Temanızı seçin (veya oluşturun).
Şablon kitaplığından bir başlangıç yeri seçmek için themeRoller sitesini kullanın. Ardından, istediğiniz her şeyi yapmak için temanızı özelleştirebilirsiniz (renkleri, yazı tiplerini ve diğer öğeleri değiştirerek).
-
Temayı indirin.
themeRoller bir indirme düğmesi vardır. Temanızı indirmeye hazır olduğunuzda bunu tıklayın.
-
İstediğiniz öğeleri seçin.
Bir projeye ilk başladığınızda muhtemelen tüm unsurları seçeceksiniz. Sayfanın çok yavaş yüklendiyse, yalnızca ihtiyacınız olan öğeleri içeren daha küçük bir sürüm oluşturabilirsiniz. Şimdilik, her şeyi seçin.
-
Dosyayı indirin.
İstediğiniz öğeleri seçtikten sonra, bunları bir zip dosyasında indirebilirsiniz.
-
Zip dosyasının içeriğini çalışma dizininize yükleyin.
Zip dosyası bir dizi dosya ve dizin içerir. Css ve js dizinlerini, web sayfalarınızın bulunduğu dizine (genellikle public_html veya htdocs dizini) kopyalayın. Development-bundle dizinini veya dizini kopyalamanıza gerek yoktur. html sayfası.
-
Birden çok tema yüklerseniz, yalnızca temaları ek temalardan kopyalayın.
Tüm temalar aynı JavaScript'i kullanıyor. Yalnızca CSS (ve ilgili resim dosyaları) değişir. Projenizde birden fazla tema istiyorsanız, CSS içeriğini kopyalamanız yeterlidir. Her tema, ana CSS dizininin farklı bir alt dizini olacaktır.
-
CSS dosyalarına bağlantı.
jQuery UI tarafından oluşturulan CSS dosyalarına bağlanmak için standart bağlantı tekniğini kullanın. Ayrıca kendi CSS dosyalarınıza bağlanabilir veya özel CSS'ye ek olarak dahili CSS kullanabilirsiniz. Yolun doğru olduğundan emin olun.
-
JavaScript dosyalarına bağlantı.
jQuery UI araç seti ayrıca iki JavaScript dosyası yükler: standart jQuery kitaplığı ve jQuery UI kitaplığı. Varsayılan olarak, bu dosyaların her ikisi de js dizinine yüklenir. Her iki dosyaya da bağlanmanız gerekir. Bazen normal sürümlerin yanında küçültülmüş dosyaları göreceksiniz. Simgeleştirilmiş versiyonda min katıştırılmış terim olacaktır. Her iki sürüm de iyi, ancak simge durumuna küçültülmüş sürüm daha hızlı yüklenecek.
Bir şey doğru çalışmıyorsa, dosya yollarınızı tekrar kontrol edin. Doğru dosyaları bağlamadığınız için neredeyse her zaman sorunlar ortaya çıkıyor. Ayrıca, jQuery UI tarafından oluşturulan CSS dosyalarının da resim içerdiğini unutmayın. Temanızın ilişkili bir resim dizini olduğundan veya projenizin düzgün çalışmayabileceğinden emin olun. İndirilen tüm CSS ve JS dizinlerini kopyaladıysanız iyi olur.
