ホームページ >ウェブフロントエンド >jsチュートリアル >ページの読み込みステータスを判断し、マスクとバッファを追加する JS コード

ページの読み込みステータスを判断し、マスクとバッファを追加する JS コード

WBOY
WBOYオリジナル
2016-05-16 17:49:10939ブラウズ
コードをコピーします コードは次のとおりです。

functionInitialize() {
addcloud(); // ページにマスクを追加します
document.onreadystatechange = subSomething; //読み込みステータスの変更をリッスンします
}
function addcloud() {
var bodyWidth = document.documentElement.clientWidth;
var bodyHeight = Math .max(document.documentElement.clientHeight, document.body.scrollHeight);
var bgObj = document.createElement("div" );
bgObj.setAttribute( 'id', ' bgDiv' );
bgObj.style.position = "0";
bgObj.style.background = "#000000"; .filter = "progid:DXImageTransform .Microsoft.Alpha(style=3,opacity=25,finishOpacity=75";
bgObj.style.opacity = "0.5";
bgObj.style.left = "0" ;
bgObj.style .width = bodyWidth "px";
bgObj.style.height = bodyHeight "px"; // zindex 属性を設定します。この div は z 軸上で最大です。ユーザーがページ上の何かをクリックしても応答はありません。
document.body.appendChild(bgObj); // マスクを追加します。 ("div");
loadingObj.setAttribute ( 'id', 'loadingDiv' );
loadingObj.style.position = "absolute";
loadingObj.style.top = bodyHeight / 2 - 32 " px";
loadingObj.style.left = bodyWidth / 2 "px";
loadingObj.style.background = "url(../img/loading.gif)" ;
loadingObj.style.width = "32px";
loadingObj.style.zIndex = "10000"; //読み込みアニメーションを追加します。 🎜>}
関数 Removecloud() {
$( "#loadingDiv").remove();
$( "#bgDiv").remove(); () {
if (document.readyState = = "complete" ) //ページが読み込まれると、ページマスクを削除し、読み込みアニメーションを削除します -
{
removecloud()
}
}

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。