ProgressBar.js ile Özel Duyarlı İlerleme Çubukları Oluşturun
İlerleme çubukları Web’deki çoğu kullanıcı tarafından yaygın olarak bilinir. Geliştiriciler için bu genellikle karmaşık bir işlemdir. sıfırdan bir ilerleme çubuğu oluşturmak. Fakat ProgressBar.js zorunda değilsin!
Bu ücretsiz açık kaynaklı kütüphane hiçbir bağımlılığı yok ve tüm büyük tarayıcıları destekler, IE9 dahil+.
Varsayılan olarak basit bir çubuk kullanın, ya da yapabilirsin birkaç temel şekil arasından seçim yapın, gibi:
- Tek çizgi
- Yarım daire
- Tam daire
- Kare
- Üçgen
Ayrıca tasarlayabilirsiniz kendi özel şekillerin kalp, bulut veya web sitenizin logosunun bile yazı gibi. Bunun biraz çaba sarf edeceği kabul edildi, ancak sonuç inanılmaz olabilir.
Kütüphane SVG yollarında çalışır, öyleyse yapabilirsen özetlenen bir şekil oluşturmak SVG işaretlemesini kullanarak yapabilirsiniz canlandır bu ilerleme çubuğu kütüphanesiyle.
Animasyonlar ayrıca metin ekle veya özel start / stop desenlerine sahip. Tam API var Seçenekler / geri aramalarla daha fazla ayrıntı Boş zamanlarında canlandırabilirsin.
ProgressBar.js ayrıca küçük bir yükleme Rehberi nerede yapabilirsin betiği indir ve kur Bower, npm veya daha basitleştirilmiş GitHub sayfasını kullanarak.
Ve eğer güzel bir şey yaparsanız, kodunuzu GitHub deposuna gönderin. Projenin yaratıcısı Kimmo Brunfeldt’in GitHub sorununu aç nerede yapabilirsin özel tasarımlar gönderin kütüphaneye dahil olmak.
Yapabilirsin animasyonlu ilerleme çubukları ekle Sayfaları kaydetmek, alanları yüklemek veya herhangi bir web sayfasına önyükleyici olarak yüklemek için. Seçenekler yalnızca ne kadar ayrıntılı almak istiyorsun.
Örneğin, şifre güç ölçer demosunu o zamandan beri seviyorum gerçek bir amaca hizmet eder ve kullanıcı deneyiminin yararları. Bu örnek geliyor eklenti ile paketlenmiş, böylece bunu kopyalayabilir ve istediğiniz şekilde değiştirebilirsiniz.
Görmek daha fazla örnek, ProgressBar.js ana sayfasını inceleyin veya bu canlandırmaya kalp animasyonunu canlandırmak için göz atın.
