پیشبارگذار(preloader)
پیشبارگذار به طور خودکار با استفاده از سیستم انتقال AJAX به همه صفحات اضافه میشود و پس از بارگذاری صفحه مخفی میشود.
<div id="preloader">
<div class="spinner-border color-highlight" role="status"></div>
</div>
کد بالا نشان دهنده Preloader است. در کد spinner-border را داریم. میتوانید با جایگزین کردن color-highlight با هر یک از رنگهای موجود در بخش رنگ ها، رنگ پیشبارگذار را جایگزین کنید.
بر خلاف قالب های دیگر که از پیشبارگذار فقط بدلیل داشتن یک تصویر برای مخفی کردن بارگذاری سایت خود استفاده میکنند و گاهی اوقات قبل از بارگیری صفحه نشان داده میشود، پیشبارگذار ما به رویداد window.load اضافه میشود و در داخل یک تابع ویژه که تشخیص میدهد چه زمانی صفحه در واقع بارگیری را به پایان رسانده است و تنها در آن زمان، پیشبارگذار را مخفی میکند.
نکته نکته برای توسعه دهندگان: پیشبارگذار مخفی نمیشود
-
علت احتمالی 1: اگر در صفحه شما پیشبارگذار مخفی نمیشود، باید کنسول را در مرورگر خود بررسی کنید. این بدان معنی است که جاوا اسکریپت به درستی اجرا نمیشود و توابعی که پیشبارگذار را پنهان میکنند، فعال نمیشوند.
-
علت احتمالی 2: اگر در مرورگرهای ناسازگاری که از CSS3 پشتیبانی نمیکنند آزمایش کنید، پیشبارگذار ها نیز نمیتوانند ظاهر شوند. به عنوان مثال، اینترنت اکسپلورر، زیرا مرورگرهایی که از CSS3 پشتیبانی نمیکنند، با هر کد مدرن مشکلات جدی ایجاد میکنند.