2015-08-18 35 views
0

我想一旦主格在JQuery的滿載簡單地掩飾我的負荷格後,似乎一切我都嘗試過網上的建議不工作,我堅持。使元素直接隱藏顯示完成的jQuery

我試着開始做順序是這樣的:

$("#main").show(); 
$("#loading").hide(); 

但觸發隱藏功能的節目完成之前

然後我試圖做到這一點在如下回調函數:

$("#main").show(500, function(){ 
    $("#loading").hide(); 
}); 

但這個被炒得早,所以裝載都會消失,就什麼也沒有了半秒,直到主的div顯示,這是不是我想要的東西。

於是我試圖用承諾方法如下所示:

$("#main").show().promise().done(function(){ 
    $("#loading").hide(); 
}); 

但是這個div立即隱藏加載和你很難看到它的主DIV顯示之前。

我無法找到任何其他方式來做到這一點。

+1

使用'fadeIn'和'fadeOut',而不是'show'和'隱藏' – Tushar

+0

但我不希望任何動畫 – kabeersvohra

回答

0

隱藏加載DIV之前設置超時。

setTimeout(function(){ 
    $("#loading").hide(); 
}, 1000); 
+0

這個問題是我不希望在屏幕上加載與其他股利同時。我想隱藏馬上不經過某任意點後 – kabeersvohra

+0

@ KVohra95觸發[檢查此的jsfiddle(http://jsfiddle.net/suh4auea/) – aarjithn

+0

嗯。似乎並沒有在真正的代碼中爲我工作。我會接受這個解決方案,因爲你已經證明它的工作原理,它可能對未來有用 – kabeersvohra

0

替換代碼:

$("#main").show(500, function(){ 
    $("#loading").hide(); 
}); 

無論使用哪種:

setTimeout(function() { 
    $("#main").show(0, function(){ 
     $("#loading").hide(); 
    }); 
}, 500); 

或者使用:

$("#main").delay(500).show(0, function(){ 
    $("#loading").hide(); 
}); 
+0

這兩個都有同樣的問題。有延遲,然後加載隱藏,等待半秒,然後主div顯示 – kabeersvohra

0

新增jQuery的完整事件處理程序來展示,所以它會隱藏加載DIV它完成時:

$("#main").show(complete(function(){ 
     $("#loading").hide(); 
    }); 
+0

我試過這個,但它只是掛起,並沒有隱藏加載div也沒有顯示主分區 – kabeersvohra

0

這是你在找什麼?

$("#main").show(1000, function() { 
 
    $("#loading").hide(); 
 
});
#main { 
 
    width: 100px; 
 
    height: 100px; 
 
    background-color: red; 
 
} 
 
#loading { 
 
    position: absolute; 
 
    top: 10px; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
 
<div id="main" hidden></div> 
 
<div id="loading">Loading...</div>

+0

這是一樣的解決方案我已經試過。加載消失和主div出現 – kabeersvohra

+0

_loading正在消失和主div出現之間有一個延遲?加載完成後,你想要顯示'main' div嗎? – arunatebel

+0

是的。當主div加載時,我基本上要調用hide,而不是加載。回調函數等待css被更改,但不是要在屏幕上繪製的實際元素 – kabeersvohra