تصف هذه المقالة تأثير موجه التحميل قبل تحميل الصفحة التي تم تحميلها بواسطة JS. شاركه للرجوع إليه ، على النحو التالي:
1. رمز JS:
// احصل على الارتفاع المرئي وعرض صفحة المتصفح var _pageheight = document.documentElement.clientheight ، _pageWidth = document.documentElement.clientwidth ؛ // حساب المسافة بين مربع التحميل من الأعلى واليسرى (عرض صندوق التحميل هو 215px ، الطول) (_pageheight - 61) / 2: 0 ، _Loadingleft = _pageWidth> 215؟ (_pageWidth - 215)/2: 0 ؛ // loadinghtml المحتوى المخصص المعروض قبل أن يتم تحميل الصفحة var _loadinghtml = '<div id = "loadingdiv" style = "الموضع: المطلق ؛ اليسار: 0 ؛ العرض: 100 ٪ ؛ الارتفاع:' + _pageheight + "PX ؛ الخلفية:#f3f8ff ؛ عتامة: alpha (80) ؛ z-index: Padding-Left: 50px. يتم تقديم تأثير التحميل على المستند. write (_loadinghtml) ؛ // window.onload = function () {// var loadingmask = document.getElementById ('loadingdiv') ؛ حالة التحميل هي كاملة الدالة completeLoading () {if (document.ReadyState == "COMMUNT") {var loadingmask = document.getElementById ('loadingdiv') ؛ loadingmask.parentnode.removechild (loadingmask) ؛ }}2. التأثير:
يوضح:
فقط ضع هذا القسم من رمز JS في <head> في النهاية ؛
يمكن تعديل نمط تأثير التحميل وفقًا لأسلوبك. تحتاج إلى العثور على صورة loading.gif بنفسك (العديد منها متوفرة عبر الإنترنت).
انقر هنا لتنزيل رمز المثيل التجريبي الكامل.
لمزيد من المعلومات حول jQuery ، يمكن للقراء المهتمين بهذا الموقع عرض الموضوعات: "ملخص المؤثرات الخاصة الكلاسيكية المشتركة لـ jQuery" ، "ملخص المكونات الشائعة الاستخدام واستخدامات jQuery" ، "ملخص لمهارات تشغيل JSORE ،" ملخص المهارات "، ملخص المهارات المملوكة ،" ملخص مهارات الإرشاد ، "ملخص مهارات الإرشاد ، التأثيرات والتقنيات "،" ملخص استخدام Ajax في jQuery "،" ملخص الرسوم المتحركة jQuery واستخدام المؤثرات الخاصة "و" ملخص استخدام محدد jQuery "
آمل أن تكون هذه المقالة مفيدة لبرمجة jQuery للجميع.