Превращение двух элементов видимых / скрытых в одном и том же элементе
У меня проблема с включением одного элемента, а другого - в том же самом div. Кажется, я создаю объект, который должен это делать, и когда я нажимаю на него, он скрывает весь элемент div вместо того, чтобы включать и выключать один элемент. Что еще мне нужно добавить, чтобы сделать эту работу?
CSS#test1 {
width:804px; margin-left:auto; margin-right:auto; height:250px; float:left; overflow:hidden; display:none;
}
#test2 {
width:804px; margin-left:auto; margin-right:auto; height:250px; float:left; overflow:hidden; display:block;
}
.mydiv {
}
#test {
width:804px; margin-left:auto; margin-right:auto; height:250px; float:left; overflow:hidden;
}
#labor{
float:left; width:38px; height:125px;
}
#odc {
float:left; width:32px; height:125px;
}
HTML <div id="test">
<div class="mydiv" id="test1">
<script src="../../Dashboard/Charts/FusionCharts.js" type="text/javascript"></script>
<div id="line3ChartContainer" style="display:normal">
<asp:Literal ID="Literal9" Visible="true" runat="server"></asp:Literal></div>
</div>
<div class="mydiv" id="test2">
<script src="../../Dashboard/Charts/FusionCharts.js" type="text/javascript"></script>
<div id="popChartContainer" style="display:normal">
<asp:Literal ID="Literal3" Visible="true" runat="server"></asp:Literal></div>
</div>
</div>
<img src="../../images/labortab.png" id="labor" onmousedown="document.test1.visibility='false';document.test2.visibility='true';"/>
<img src="../../images/odctab.png" id="odc" onmousedown="document.test1.visibility='true';document.line3ChartDiv.visibility='false';"/>
Надеюсь, это выглядит лучше.