בניית מותאמת אישית התקדמות ברים התקדמות עם התקדמות

פסי התקדמות ידועים על ידי רוב המשתמשים באינטרנט. עבור מפתחים, זה לעתים קרובות תהליך מסובך ליצור סרגל התקדמות מאפס. אבל עם התקדמות אתה לא צריך!

זה ספריית קוד פתוח חינם אין תלויות ו תומך בכל הדפדפנים העיקריים, כולל IE9+.

כברירת מחדל, תוכל להשתמש בר פשוט, או שאתה יכול בחר מתוך כמה צורות בסיסיות, כמו:

• שורה בודדת
• חצי מעגל
• מעגל שלם
• כיכר
• משולש

ניתן גם לעצב צורות מותאמות אישית משלך כגון לב, ענן, או אפילו את האותיות של הלוגו של האתר שלך. אמנם זה ייקח קצת מאמץ אבל התוצאה הסופית יכולה להיות מדהימה.

הספרייה עובד על שבילי SVG, אז אם אתה יכול לבנות צורה מסודרת באמצעות סימון SVG אתה יכול להנפיש אותו עם ספריית ספריית התקדמות זו.

אנימציות יכול גם כולל טקסט או יש מותאמים אישית / להתחיל דפוסים. ממשק ה- API המלא כולל פרטים נוספים עם אפשרויות / callbacks כי אתה יכול לעיין בשעות הפנאי שלך.

ProgressBar.js יש גם קטן מדריך התקנה שבו אתה יכול להוריד ולהגדיר את התסריט באמצעות באואר, npm, או את דף GitHub פשוט יותר.

ואם אתה בונים משהו מגניב אתה יכול שלח את הקוד שלך לתוך ריפו GitHub. היוצר של הפרויקט, Kimmo Brunfeldt יש לפתוח את הנושא GitHub שבו אתה יכול להגיש עיצובים מותאמים אישית להיכלל בספריה.

אתה יכול להוסיף פסי התקדמות אנימציה לדפי הרשמה, להעלות שדות, או לכל דף אינטרנט כנטען מראש. האפשרויות מוגבלות רק על ידי כמה מפורט אתה מוכן לקבל.

לדוגמה, אני אוהב את הסיסמה כוח מטר הדגמה מאז זה משרתת מטרה אמיתית ו היתרונות של חוויית המשתמש. דוגמה זו באה ארוז עם תוסף, כך שתוכל להעתיק את זה ולשנות אותו לטעמך.

לראות דוגמאות נוספות, לבדוק את הבית ProgressBar.js או להציץ זה כינור demoing את הלב אנימציה.