CSS:如何隱藏代碼加載圖像格背後
<style type="text/css">
.modal
{
position: fixed;
top: 0;
left: 0;
background-color: black;
z-index: 99;
opacity: 0.8;
filter: alpha(opacity=80);
-moz-opacity: 0.8;
min-height: 100%;
width: 100%;
}
.loading
{
font-family: Arial;
font-size: 10pt;
border: 5px solid #67CFF5;
width: 200px;
height: 100px;
display: none;
position: fixed;
background-color: White;
z-index: 999;
}
</style>
JS:
<script type="text/javascript">
function ShowProgress() {
// alert("aa");
setTimeout(function() {
var modal = $('<div />');
modal.addClass("modal");
$('body').append(modal);
var loading = $(".loading");
loading.show();
var top = Math.max($(window).height()/2 - loading[0].offsetHeight/2, 0);
var left = Math.max($(window).width()/2 - loading[0].offsetWidth/2, 0);
loading.css({ top: top, left: left });
}, 200);
}
</script>
HTML:
<div class="loading" align="center" id="loader">
Loading. Please wait.
<br />
<img id="abc" src="../../Images/loader.gif" alt="" />
</div>
<div>
<asp:UpdatePanel ID="UpdatePaneltab" runat="server" UpdateMode="Always">
<ContentTemplate>
<asp:Button ID="btnSearch" runat="server" Text="Run" CssClass="btn-in" OnClick="btnSearch_Click" OnClientClick="ShowProgress()" />
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="btnSearch" />
</Triggers>
</asp:UpdatePanel>
我使用上面的代碼顯示在加載圖片的div按鈕單擊。但我無法將其隱藏在按鈕點擊代碼內部的任何位置。在所有按鈕點擊代碼執行後它會自動隱藏ed.I具有exporttoexcel功能,我想在我的這個功能開始執行之前隱藏它,因爲一旦導出開始,就不能控制頁面和代碼。但是即使在導出完成後,加載圖像也會持續顯示。 目前我正在使用
ClientScript.RegisterStartupScript(this.GetType(), "hwa", "document.getElementById('loader').style.visibility = 'hidden';", true);
隱藏div。
我無法找出最新的問題。有些東西我缺少,我需要添加代碼。 有什麼建議嗎?有任何想法嗎? 請helpme.I卡住了。
oops ..sorry ..actualy它的hidden.i發佈了一個錯誤的code.its行,只隱藏但仍然無法隱藏它。 – Pwavel002
感謝您的解決方案。我試過你的解決方案..但它不工作 – Pwavel002