Artikel ini menjelaskan efek prompt pemuatan sebelum halaman yang dimuat oleh JS dimuat. Bagikan untuk referensi Anda, sebagai berikut:
1. Kode JS:
//Get the visible height and width of the browser page var _PageHeight = document.documentElement.clientHeight, _PageWidth = document.documentElement.clientWidth;//Calculate the distance between the loading box from the top and left (the width of the loading box is 215px, the height is 61px) var _LoadingTop = _PageHeight > 61 ? (_PageHeight - 61) / 2: 0, _Loadingleft = _pagewidth> 215? (_Pagewidth - 215)/2: 0; // muat konten khusus yang ditampilkan sebelum halaman tidak dimuat var _loadinghtml = '<div id = "loadingdiv" style = "Posisi: absolute; kiri: 0; lebar: 100%; tinggi:' + _pageHeight + 'TOP: 0; Latar belakang:#F3F8FF; Opacity: 0.8; Filter: Alpha (Opacity = 80); Z-index: 10000; "> <div style =" Posisi: absolut; Padding-left: 50px; Efek pemuatan diberikan dokumen.write (_LoadingHtml); // window.onload = function () {// var loadingmask = document.getElementById ('loadingdiv'); // loadingmask.parentnode.removechild (loadingmask); //}; // dengarkan The Loading. status pemuatan adalah fungsi lengkap fungeLoading () {if (document.readystate == "complete") {var loadingmask = document.geteLementById ('loadingdiv'); loadingmask.parentnode.removechild (loadingmask); }}2. Efek:
menjelaskan:
Cukup masukkan bagian kode JS ini ke <head> di akhir;
Gaya efek pemuatan dapat dimodifikasi sesuai dengan gaya Anda sendiri. Anda perlu menemukan sendiri gambar Loading.gif (banyak dari mereka tersedia online).
Klik di sini untuk mengunduh kode instance demo lengkap.
Untuk informasi lebih lanjut tentang jQuery, pembaca yang tertarik dengan situs ini dapat melihat topik: "ringkasan efek khusus klasik umum jQuery", "ringkasan plug-in dan penggunaan jQuery yang umum digunakan", "ringkasan tabel jQuery (tabel) Keterampilan operasi", "ringkasan keterampilan operasi jQuery", ringkasan ringkasan operasi jQuery Data Jsony "Ringkasan JUSIRY DATA" Ringkasan JQuery Ringkasan Efek dan Teknik Khusus "," Ringkasan Penggunaan Ajax di JQuery "," Ringkasan Animasi JQuery dan Penggunaan Efek Khusus "dan" Ringkasan Penggunaan Pemilih JQuery "
Saya harap artikel ini akan membantu pemrograman jQuery semua orang.