DIV style=none,但是仍然显示DIV(用于弹出处理图形)
DIV style = none, but div is still displayed (used for pop up processing graphic)
我有一个div元素中的弹出处理图形的问题,我无法使其消失。当需要时,图形会正确显示,但当我尝试使其不显示时,它仍然存在。
我正在使用如下所示的微调器功能:http://www.codeproject.com/Tips/701197/A-master-page-level-spinner-animation
因此,我的主页中有div元素:
<!--Content start-->
<div id="content">
<asp:ContentPlaceHolder ID="MainContent2" runat="server">
</asp:ContentPlaceHolder>
<div class="clr"></div>
<div id="SpinnerContainer"></div>
<div id="Spinner" style="background:url(/images/loader.gif) no-repeat center #fff;"></div>
</div>
<!--Content end-->
我在主页中有一些java脚本,使其可见,如下所示:
function ToggleSpinnerBlock(Visible) {
var displayValue = Visible ? "block" : "none";
document.getElementById("SpinnerContainer").style.display = displayValue;
document.getElementById("Spinner").style.display = displayValue;
var isIE = navigator.userAgent.indexOf('MSIE') > 0;
if (Visible && isIE) {
$('#Spinner').css("backgroundImage", "");
setTimeout("AppendSpinnerImageForIE();", 10);
}
}
和一个连接的CSS样式如下:
/* Loader spinner styles */
div#SpinnerContainer
{
position: absolute;
display: none;
left: 0;
right: 0;
top: 0;
bottom: 0;
background-color: #fff;
opacity:0.4;
filter:alpha(opacity=40); /* For IE8 and earlier */
z-index: 1000; /* Important to set this */
}
div#Spinner
{
position: absolute;
display: none;
width:50px;
height: 50px;
top: 48%;
left: 48%;
z-index:1001;
overflow: auto;
}
在我的子窗体中,我的按钮调用javascript,如下所示:
<asp:Button ID="btnFilter" ToolTip="Select to search for patients using the above filter criteria" runat="server" Text="Filter"
onclick="btnFilter_Click" OnClientClick="return BeforePostBack()" CssClass="btnDownloadSearchClear"/>
这一切都很好——我按下按钮,就得到了我的旋转器。太棒了
但是,在我的代码中,我需要能够隐藏微调器。因此,在我的c#服务器代码中,我使用:
Page.ClientScript.RegisterStartupScript(this.GetType(), "", "HideSpinner();", true);
它在我的子(主应用程序(页面中调用了一个新的javascript函数,如下所示:
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent2" runat="server">
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</asp:ToolkitScriptManager>
<script type="text/javascript">
function BeforePostBack() {
$('#PostBackResult').text('');
ToggleSpinnerBlock(true);
return true; //So that allow post back to server
}
function HideSpinner() {
$('#PostBackResult').text('');
HideSpinnerBlock(false);
return true; //So that allow post back to server
}
</script>
然后调用主页javascript如下:
function HideSpinnerBlock(Visible) {
var displayValue = Visible ? "block" : "none";
document.getElementById("Spinner").style.display = 'none';
document.getElementById("SpinnerContainer").style.display = 'none';
}
现在我100%知道javascript HideSpinnerBlock正在被调用(我已经通过Firebug设置了警报和错误代码来捕获它(,它正在被调用,但微调器错误仍然存在于屏幕上。
有什么想法吗?
PS-是的,我知道我的HideSpinnerBlock可以用False设置调用ToggleSpinnerBlock,但在失败后,我决定硬编码它。
有什么想法吗?我在这个上面拔头发。
也许也可以尝试将背景设置为none。这就是你的微调器所在的地方。你真的应该只生成一个具有属性的类,比如。。。
.hideSpinner {
display: none !important;
background: none !important;
background-image: none !important;
}
然后添加类。。。
var d = document.getElementById("Spinner");
d.className = d.className + " hideSpinner";
相关文章:
- 绝对定位不适用于Javascript DIV
- 用于Dynamic Div'的Javascript数学函数;s风格
- Bootstrap Typeahead不适用于某些Div Id's
- 用于Div向下滑动效果的Javascript代码
- jQuery激活器不适用于多个DIV
- 非常简单的 .toggleClass 用于基于 HREF 的 Div
- 无法将页面 CSS 应用于 DIV 对于 stackoverflow.com 中的每个主题
- 有一个用于x个卷轴的DIV“棍子”
- 背景轮播,用于在幻灯片图像中包含 DIV
- jQuery 泡芙效果,用于在应用效果后返回 Div
- CSS 切片/插槽过渡效果,用于/与 DIV 一起使用
- Mousover 父 DIV 用于更改子 DIV 背景
- jquery滑块不适用于DIV
- 仅将CSS应用于子DIV
- DIV 中的 CSS 中心中间元素,用于多种屏幕尺寸
- 点击关闭Div不适用于Chrome,但适用于所有其他浏览器
- jQuery,get-each()img维度应用于each()DIV
- 无法使用 Javascript 将 jQuery 类应用于 HTML DIV
- 如果仍在视图中,则用于更改DIV偏移的JQuery算法
- DIV style=none,但是仍然显示DIV(用于弹出处理图形)