[英]Using a fade-out div as a splash screen through jQuery?
在页面加载时显示 div 的脚本使用 jQuery 来模拟闪屏?
那很简单! 您可以使用 jQuery fadeOut()
:这是代码:
CSS
#splashscreen {
height: 100%;
width: 100%;
z-index: 99;
}
上面的 CSS 将使启动画面填满整个页面并高于一切。
jQuery 刘先生
$(window).load(function() {
$('#splashscreen').fadeOut('slow');
});
它将做的是,当它检测到页面已加载时,它会慢慢淡出闪屏 div。
HTML
<div id="splashscreen">
Put your splashscreen content here. It can be anything!
</div>
这就是创建启动画面所需的全部内容。 不幸的是,这不能在 JSFiddle 中模拟。
您可以在加载脚本的某些部分后通过调用函数来计时加载:
$(document).ready(function() {
var oneLoaded;
function partOneLoaded() {
oneLoaded = 1;
loadReady();
}
var twoLoaded;
$('div').load('../inc/salesstatus.php, function() {
twoLoaded = 1;
loadReady();
});
function loadReady(){
if (oneLoaded == 1 && twoLoaded == 1)
$('#loadcontainer').fadeOut('slow');
}
/* ****rest of your script here ****** */
// ie) at the end of your scripts:
partOneLoaded();
});
一旦加载了某些东西或运行了一个脚本,您就可以调用您的函数,它们都会尝试调用 loadReady()。 只有最后一次尝试才能成功淡出您的 div。 在脚本末尾放置一个调用,如果 loadcontainer 在加载其他内容之前淡出,则在尚未加载的项目末尾添加另一个 function。
我不会进入加载 div 的 css 和 html,因为它在您问题的 scope 之外。
你的问题很含糊。 将来,请提供更多详细信息,以便我们更好地了解您的工作内容。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.