我有以下javascript,它是在页面空闲时触发和创建的加载程序。它基本上显示下一个导航页面正在加载。该脚本驻留在(ASP.NET)母版页和Ajaxified用户控件上。
我需要让代码跨浏览器但不确定违法者是什么。
它只适用于Trident(仅测试IE9和10) - 不适用于Webkit或Gecko。
我不确定这是否是一个符号问题,或者Chrome和Safari的页面生命周期是否都没有声明为“!=完成”,因此不会触发该条件。
我也希望保持这个纯粹的Javscript解决方案 - 没有jQuery。
由于
loader = 0;
if (window.location.href.indexOf("Login.aspx") < 0) {
setInterval(function () {
if (document.readyState != 'complete') {
document.documentElement.style.overflow = "hidden";
var navLoader = document.createElement("div");
var loaderText = document.createElement("div");
var loaderImg = document.createElement("div");
navLoader.id = "navLoaderDiv";
navLoader.className = "navLoader";
loaderImg.id = "loaderImg";
loaderText.id = "loaderText";
loaderImg.className = "loaderImg";
loaderText.className = "loaderText";
navLoader.appendChild(loaderImg);
navLoader.appendChild(loaderText);
loaderText.innerHTML = "Working on it";
var zedDepth = 99999;
navLoader.style.zIndex = zedDepth;
navLoader.style.background.image = "url(~/Images/loaderHalo2.png) 0 0 / 100% 100% no-repeat";
navLoader.style.position = "absolute";
navLoader.style.right = "0px";
navLoader.style.left = "0px";
navLoader.style.top = "25px";
navLoader.style.bottom = "0px";
if (loader == 0) {
document.documentElement.appendChild(navLoader);
loader = 1;
}
} else if (document.getElementById('navLoaderDiv') != null) {
document.getElementById('navLoaderDiv').style.display = "none";
document.documentElement.style.overflow = "hidden";
}
}, 1000)
}