Question

我正在尝试在页面加载时创建显示加载图像，后面的屏幕应该隐藏，只有加载图像应该出现至少10分钟。

添加到显示加载图标：

CSS：

#loading {
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    position: fixed;
    display: block;
    opacity: 0.7;
    background-color: #fff;
    z-index: 99;
    text-align: center;
}

#loading-image {
    position: absolute;
    top: 100px;
    left: 240px;
    z-index: 100;

HTML：

<div id="loading" style="display:none;">
    <img id="loading-image" src="<%=request.getContextPath()%>/resources/img/loadingImg.gif" alt="Loading..." />
</div>
<button type="submit" value="" class="btninstall btn-primary" onclick="showLoading()">INITIATE</button>

JavaScript的：

function showLoading() {  
    var message = "Your Request has been Initiated, You may close the browser and continue your work.Once the Application Installed, it will appear in your Program List."+"\n"+"You can also check the status of your install progress on the Status Tab.";
    alert(message);     
    // $("#loading").fadeOut(5000) ;  
    $('#loading').show();
    //alert(setTimeout(30));        
}

这就是我想要的，请在我错的地方纠正我。

Answer 1

试试这个：

$(".btninstall").on("click", function(){
    var message = "Your Request has been Initiated, You may close the browser and continue your work.Once the Application Installed, it will appear in your Program List."+"\n"+"You can also check the status of your install progress on the Status Tab.";
alert(message);
$("#loading").delay(5000).fadeOut();
$("#loading").show();

}）;

DEMO

Answer 2

要显示加载图像，您必须处理$（window）.load事件，因为加载页面后应显示加载。

$(window).load(function(){
     $('#loading').fadeOut(5000);
});

如何在页面加载时显示加载图像时添加时序？

2 个答案: