Div+Css+JS做多个显示/隐藏内容块
相关样式:
JS:
Code
HTML:<div class="mainbox">
<span class="headactions">
<img id="category_CN_img" src="http://www.cnblogs.com/Images/expand.jpg" alt="展开/收起" onclick="toggle_collapse('category_CN');"/>
</span>
<h3 onclick="toggle_collapse('category_CN');">
<a href="#">Content</a>
</h3>
<div id="category_CN" style=" display:none;">
<table class="tablelist" align="center" cellpadding="0">
<tr>
<td>
Title:
</td>
<td colspan="3">
<te:TETextBox ID="txtCSTitle" runat="server" Width="380px" MaxLength="100"></te:TETextBox>
</td>
</tr>
<tr>
<td>
Content:
</td>
<td colspan="3">
<FCKeditorV2:FCKeditor ID="txtCSContent" runat="server" Height="350px" Width="98%">
</FCKeditorV2:FCKeditor>
</td>
</tr>
</table>
</div>
</div>
<span class="headactions">
<img id="category_CN_img" src="http://www.cnblogs.com/Images/expand.jpg" alt="展开/收起" onclick="toggle_collapse('category_CN');"/>
</span>
<h3 onclick="toggle_collapse('category_CN');">
<a href="#">Content</a>
</h3>
<div id="category_CN" style=" display:none;">
<table class="tablelist" align="center" cellpadding="0">
<tr>
<td>
Title:
</td>
<td colspan="3">
<te:TETextBox ID="txtCSTitle" runat="server" Width="380px" MaxLength="100"></te:TETextBox>
</td>
</tr>
<tr>
<td>
Content:
</td>
<td colspan="3">
<FCKeditorV2:FCKeditor ID="txtCSContent" runat="server" Height="350px" Width="98%">
</FCKeditorV2:FCKeditor>
</td>
</tr>
</table>
</div>
</div>
JS:
Code