Line 1: | Line 1: | ||
− | var _LoadingHtml = '<div id="loadingDiv" style="position:absolute;left:0;top:0;width:calc(100%);height:100%;background-color: #E6E6E6;z-index: | + | //在页面未加载完毕之前显示的loading Html自定义内容 |
+ | var _LoadingHtml = '<div id="loadingDiv" style="position:absolute;left:0;top:0;width:calc(100%);height:100%;background-color: #E6E6E6;z-index: 9999;margin:0;padding:0;"><img style="position: absolute;top: calc(50% - 90px);left:calc(50% - 86px);height: 180px;width: 172px;z-index:999999;" src="https://static.igem.org/mediawiki/2018/0/0b/T--BIT-China--iGEM2018-A_loading.gif"></div>'; | ||
+ | //呈现loading效果 | ||
document.write(_LoadingHtml); | document.write(_LoadingHtml); | ||
+ | |||
+ | //监听加载状态改变 | ||
document.onreadystatechange = completeLoading; | document.onreadystatechange = completeLoading; | ||
+ | |||
+ | |||
+ | //加载状态为complete时移除loading效果 | ||
function completeLoading() { | function completeLoading() { | ||
+ | |||
+ | |||
+ | |||
+ | |||
document.documentElement.style.overflow = 'hidden'; | document.documentElement.style.overflow = 'hidden'; | ||
if (document.readyState == "complete") { | if (document.readyState == "complete") { | ||
+ | |||
window.onbeforeunload = function () { | window.onbeforeunload = function () { | ||
− | document.documentElement.scrollTop = 0; | + | document.documentElement.scrollTop = 0; //ie下 |
− | document.body.scrollTop = 0; | + | document.body.scrollTop = 0; //非ie |
} | } | ||
+ | |||
+ | |||
+ | |||
$(window).load(function () { | $(window).load(function () { | ||
$('#loading_all').delay(300).hide(0); | $('#loading_all').delay(300).hide(0); | ||
setTimeout(function () { | setTimeout(function () { | ||
− | $(' | + | $('body').removeClass("scoll_dis"); |
+ | |||
}, 300); | }, 300); | ||
$.fn.fullpage.setAllowScrolling(false, 'down'); | $.fn.fullpage.setAllowScrolling(false, 'down'); | ||
}); | }); | ||
+ | |||
setTimeout(function () { | setTimeout(function () { | ||
+ | |||
+ | |||
var loadingMask = document.getElementById('loadingDiv'); | var loadingMask = document.getElementById('loadingDiv'); | ||
loadingMask.classList.add('imgA-nav-gradient-back'); | loadingMask.classList.add('imgA-nav-gradient-back'); | ||
Line 23: | Line 42: | ||
setTimeout(function () { | setTimeout(function () { | ||
+ | |||
var loadingMask = document.getElementById('loadingDiv'); | var loadingMask = document.getElementById('loadingDiv'); | ||
loadingMask.classList.remove('imgA-nav-gradient-back'); | loadingMask.classList.remove('imgA-nav-gradient-back'); | ||
loadingMask.parentNode.removeChild(loadingMask); | loadingMask.parentNode.removeChild(loadingMask); | ||
− | $.fn.fullpage.setAllowScrolling(true, 'down'); | + | $.fn.fullpage.setAllowScrolling(true, 'down'); |
+ | // body.style="overflow-x:hidden;" | ||
}, 4400); | }, 4400); | ||
} | } | ||
+ | |||
function newFunction() { | function newFunction() { | ||
return false; | return false; | ||
} | } | ||
} | } |
Revision as of 15:18, 16 October 2018
//在页面未加载完毕之前显示的loading Html自定义内容
var _LoadingHtml = '<img style="position: absolute;top: calc(50% - 90px);left:calc(50% - 86px);height: 180px;width: 172px;z-index:999999;" src="">
';
//呈现loading效果 document.write(_LoadingHtml);
//监听加载状态改变 document.onreadystatechange = completeLoading;
//加载状态为complete时移除loading效果
function completeLoading() {
document.documentElement.style.overflow = 'hidden'; if (document.readyState == "complete") {
window.onbeforeunload = function () { document.documentElement.scrollTop = 0; //ie下 document.body.scrollTop = 0; //非ie }
$(window).load(function () { $('#loading_all').delay(300).hide(0); setTimeout(function () { $('body').removeClass("scoll_dis");
}, 300); $.fn.fullpage.setAllowScrolling(false, 'down'); });
setTimeout(function () {
var loadingMask = document.getElementById('loadingDiv'); loadingMask.classList.add('imgA-nav-gradient-back'); document.documentElement.style.overflowY = 'auto'; }, 3000);
setTimeout(function () {
var loadingMask = document.getElementById('loadingDiv'); loadingMask.classList.remove('imgA-nav-gradient-back'); loadingMask.parentNode.removeChild(loadingMask); $.fn.fullpage.setAllowScrolling(true, 'down'); // body.style="overflow-x:hidden;" }, 4400); }
function newFunction() { return false; }
}