چگونه یک نوار پیشرفت جاوااسکریپت را با Pace.js ایجاد کنیم

آموزش طراحی سایت

در آموزش امروز، من می خواهم به شما نشان دهیم که چگونه از این پلاگین شگفت انگیز برای بارگذاری نوار پیشرفت در سایت خود استفاده کنید.



نمایش نسخه ی نمایشی

با Pace.js:

منابع خود را باید این آموزش کامل کنید

پیاده سازی Pace.js بسیار آسان است. شما فقط باید Pace.js و تم CSS را در بخش هدر سایت وارد کنید و کار شما انجام می شود. بدون نیاز به اضافه کردن یک کتابخانه جی کوئری برای کار کردن آن!

پیکربندی

اگر چه Pace.js کاملا خودکار است؛ هیچ پیکربندی لازم نیست تا آن را کار کند. اما شما می توانید برخی از تنظیمات را انجام دهید.

دو راه برای انجام این کار:

1. قبل از وارد کردن فایل window.paceOptions :


2. گزینه هایی را در تگ اسکریپت قرار دهید:

تغییر رنگ نوار بارگذاری

شما همچنین می توانید رنگ تم ها را تغییر دهید. دو راه برای این کار وجود دارد:
1. سفارشی کردن رنگ ها از طریق Pace.js صفحه تم


2. با رفتن به فایل CSS به طور مستقیم و تغییر رنگ پس زمینه و رنگ مرز.



خیلی آسان است؟
Pace.js یک پلاگین جاوااسکریپت عالی است همراه با تم های متنوع است. همچنین برخی از پلاگین های جی کوئری دیگری مانند ProBars وجود دارد: Progress.js .


اما برای من، Pace.js بهترین است زیرا این پلاگین هیچ پیکربندی خاصی نیاز ندارد.