(عندما يتم تحميل صفحة الويب ، في بعض الأحيان يكون المحتوى أكثر من اللازم ، وقد تم تحميله وانتظاره. في هذا الوقت ، تُظهر صفحة الويب أن اللون الأبيض لا يعرض أي شيء. تجربة المستخدم سيئة للغاية. يتم عرضه للمستخدمين.
الطرق الشائعة هي كما يلي:
1. شريط التقدم في المؤقت (مزيف) <script type = text/javaScript> $ (function () {var loading = '<div class = loading> <div class = pic> </viv> </viv>' ؛ $ (body). g) ؛ Function () {$ (. loading) 2. محتوى الاستحواذ الحقيقي ، أدرك شريط التقدملتحميل شريط التقدم وفقًا للمحتوى الحقيقي ، يتم تقديم نقطتين للمعرفة أدناه:
document.OnReadyStateChange صفحة التحميل تغييرات الحدث
document.readyState إرجاع حالة المستند الحالي
1.
2. التحميل -
3. يمكن أن يبدأ المستند والمستخدم التفاعلي والمستخدم في التفاعل
4. كامل التحميل الكامل
2.1. document.OnReadyStateChange = function () {if (documeted.readyState == COMMUNT) {$ (. loading) .fadeout () ؛}} 2.2.موقع الويب الموصى به: https://preloaders.net/ يحتوي هذا الموقع على العديد من الرسوم المتحركة الصغيرة التي تشير إلى التحميل المحملة
http://autoprefixer.github.io/ لإضافة بادئات إلى CSS عبر الإنترنت
https://loading.io/ الرسوم المتحركة التقدمية الصغيرة
2.3: يتم وضع التقدم في الرأس ، كما هو موضح أدناه:ملاحظة: هذا الإدراك ليس هو العرض الحقيقي للتقدم المحمل ، ولكنه يستخدم: مبدأ تنفيذ التعليمات البرمجية من الأعلى إلى الأسفل
في مواضع مختلفة من الكود ، قم بتغيير عرض الخطوط.
كما هو موضح أدناه:
2.4 احصل على شريط التقدم لتحميل البيانات في الوقت الفعليإنشاء كائنات صورة: اسم كائن الصورة = صورة جديدة () ؛
استخدام: حدث عبر الإنترنت
ملاحظة: يجب كتابة سمة SRC خلف Onload ، وإلا فإن البرنامج سوف يرتكب خطأ في IE
ما سبق هو جميع محتويات هذه المقالة.