대부분의 경우 다른 콘텐츠를 올바르게 확장하지만 한 가지 시나리오의 콘텐츠 아래 펼쳐지는 javascript div로 문제를 디버깅하려고합니다. 문제는 디버깅을 시작할 위치를 알 수 없다는 것입니다.div 특정 서버의 IE 콘텐츠에서 확장됩니다.
배경으로, div는 ASP.NET의 타사 그리드 컨트롤을 통해 확장되어야합니다.
Firefox 5 또는 Chrome 13에서 배포 된 dev 서버에서 사이트를 탐색하거나 Visual Studio에서 로컬로 실행하면 div가 올바르게 확장됩니다. 사이트를 로컬에서 실행하는 IE8을 사용하면 효과가 제대로 확장됩니다. 그러나 배포 된 사이트에서 IE8을 사용하면 을 그리드 컨트롤 아래로 확장하는 div가 표시됩니다.
이것은 내 랩톱과 dev 서버의 차이점을 알려줍니다. 거기에서 나는 문제를 분리하고 그것을 정정하는 방법에 대해 분실했다.
#ColumnEffect
{
width: 249px;
height: 200px;
padding: 0.4em;
left:-1px;
top:20px;
position: absolute;
overflow: auto;
font-family:Calibri, Verdana, Tahoma;
font-size:10pt;
color:Black;
font-weight:normal;
text-decoration:none;
z-index:1;
}
그리고 붕괴/신축력을 트리거 JQuery와 :
여기<div class="ColumnDiv">
<span>
<asp:TextBox ID="ColumnTextBox" runat="server" CssClass="textbox">Show Columns</asp:TextBox>
<img id="ColumnArrow" src="<%= Page.ResolveUrl("~")%>images/DropDownArrow.jpg" style="margin-left: -22px; margin-bottom: -5px" />
<asp:label id="RedAsterisk" style="color:Red; font-weight:bold;" runat="server">*</asp:label>
</span>
<div id="ColumnEffect" class="ui-widget-content" style="height: 145px !important;">
<asp:CheckBoxList ID="ColumnChecks" runat="server">
<asp:ListItem Text="Select All" Value="Select All" />
<!-- Other list items -->
</asp:CheckBoxList>
</div>
</div>
<div>(Control resides here</div>
연관된 CSS입니다 : 여기
내가 페이지에서 사용하고 코드입니다function RunColumnEffect() {
if (!($('#ColumnEffect').is(":visible")))
{
$("#ColumnEffect").show('blind', 200);
}
else
{
$("#ColumnEffect").hide('blind', 200);
}
};
을 - 대단히 감사합니다! – splatto