コードビハインドでパネルのCSSクラスを動的に変更しようとしています。
とで試してみましDIVた。失敗。runat="server"div.Attributes["class"]="myClass"
それから私はaspパネルで行きました。 myPanel.cssClass = "myClass"... 失敗。
私はここでAnthonyWJonesのソリューションも試しました： CSSクラスをコードから変更する最良の方法 ：
myPanel.RemoveCssClass("arrow_box");
myPanel.AddCssClass("arrow_boxMS");
まだ成功していません。
変更したいのはの矢印だけですdiv。私はこれを手伝いました（CSSを生成するため）：
http ：//cssarrowplease.com/
私のCSS：
.arrow_box, .arrow_boxMS
{
position: relative; /*background: #88b7d5;*/
border: 2px solid #c2e1f5;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin-top: 15px;
z-index: -1;
}
.arrow_box:after, .arrow_box:before
{
bottom: 100%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute; /*pointer-events: none;*/
}
.arrow_box:after
{
border-color: rgba(136, 183, 213, 0);
border-bottom-color: #ffffff; /*#88b7d5;*/
border-width: 15px; /*SET height of smaller triangle within arrow. IMPORTANT bigger triangle is set in .arrow_box:before class*/
left: 8%;
margin-left: -15px;
}
.arrow_box:before
{
border-color: rgba(194, 225, 245, 0);
border-bottom-color: #c2e1f5;
border-width: 18px; /* SET height of bigger triangle - arrow IMPORTANT: difference between triangles must reflect how many pixels is border*/
left: 8%;
margin-left: -18px; /*if border thickness is changed adjust this to fit triangles*/
}
.arrow_boxMS:after, .arrow_boxMS:before
{
bottom: 100%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute; /*pointer-events: none;*/
}
.arrow_boxMS:after
{
border-color: rgba(136, 183, 213, 0);
border-bottom-color: #ffffff; /*#88b7d5;*/
border-width: 15px; /*SET height of smaller triangle within arrow. IMPORTANT bigger triangle is set in .arrow_box:before class*/
left: 25%;
margin-left: -15px;
}
.arrow_boxMS:before
{
border-color: rgba(194, 225, 245, 0);
border-bottom-color: #c2e1f5;
border-width: 18px; /* SET height of bigger triangle - arrow IMPORTANT: difference between trinagles must reflect how many pixels is border*/
left: 25%;
margin-left: -18px; /*if border thickness is changed adjust this to fit triangles*/
}
ボタンがクリックされても三角形は変化しません。
何か案は？
編集：
<asp:UpdatePanel runat="server">
<ContentTemplate>
<table id="tblSelection">
<tr>
<td>
<asp:Button ID="btn1" Text="1" CssClass="button" ClientIDMode="Static"
runat="server" OnClick="btn1_Click" />
</td>
<td>
<asp:Button ID="btn2" Text="2" CssClass="button" ClientIDMode="Static"
runat="server" OnClick="btn2_Click" />
</td>
<td>
<asp:Button ID="btn3" Text="3" CssClass="button" runat="server" OnClick="btn3_Click" />
</td>
<td>
<asp:Button ID="btn4" Text="4" CssClass="button" runat="server"
OnClick="btn4_Click" />
</td>
<td>
<asp:Button ID="btn5" Text="5" CssClass="button" runat="server"
OnClick="btn5_Click" />
</td>
<td>
<asp:Button ID="btn5" Text="5" CssClass="button" runat="server" OnClick="btn5_Click" />
</td>
</tr>
</table>
</ContentTemplate>
</asp:UpdatePanel>
<asp:Panel id="divDaySelection" runat="server">
<table id="tblDaySelection">
<tr>
<td>
<asp:CheckBox ID="cbAllDays" Text="All" runat="server"
oncheckedchanged="cbAllDays_CheckedChanged" AutoPostBack="true" />
</td>
<td>
<asp:CheckBox ID="cbMon" Text="Monday" runat="server" />
</td>
<td>
<asp:CheckBox ID="cbTue" Text="Tuesday" runat="server" />
</td>
<td>
<asp:CheckBox ID="cbWed" Text="Wednesday" runat="server" />
</td>
<td>
<asp:CheckBox ID="cbThu" Text="Thursday" runat="server" />
</td>
<td>
<asp:CheckBox ID="cbFri" Text="Friday" runat="server" />
</td>
<td>
<asp:CheckBox ID="cbSat" Text="Saturday" runat="server" />
</td>
<td>
<asp:CheckBox ID="cbSun" Text="Sunday" runat="server" />
</td>
</tr>
</table>
</asp:Panel>
私は今結果を得ているのでupdatepanelが問題だったようです...今私はそれを削除しました。