为了账号安全,请及时绑定邮箱和手机立即绑定

怎么让一个div显示一个div隐藏?

怎么让一个div显示一个div隐藏?

茅侃侃 2019-02-16 15:11:10
怎么让一个div显示一个div隐藏
查看完整描述

2 回答

?
GCT1015

TA贡献1827条经验 获得超4个赞

让一个div显示一个div隐藏的方法如下(代码的规格写法只能这样):

1、HTML代码如下:

<body>
<ul class="point">
<li><a href="#">menu0</a></li>
<li><a href="#">menu1</a></li>
<li><a href="#">menu2</a></li>
<li><a href="#">menu3</a></li>
<li><a href="#">menu4</a></li>
<li><a href="#">menu5</a></li>
<li><a href="#">menu6</a></li>
<li><a href="#">menu7</a></li>
</ul>
<div class="box">
<div class="con0">d0</div>
<div class="con1">d1</div>
<div class="con2">d2</div>
<div class="con3">d3</div>
<div class="con4">d4</div>
<div class="con5">d5</div>
<div class="con6">d6</div>
<div class="con7">d7</div>
</div>
</body>

2、CSS代码:

.point{
float: left;
list-style: none;
}
.point li{
margin-bottom: 10px;
}
.box{
float: right;
margin-right: 500px;
}
.box div{
width: 500px;
height: 200px;
border: 1px solid green;
display: none;
}
.box .con0{
display: block;
}

3、Javascript代码:

$(document).ready(function(){
$(".point li a").click(function(){
var order = $(".point li a").index(this);//点击之后可以返回当前a标签index的值
$(".con" + order).show().siblings("div").hide();
});
})



查看完整回答
反对 回复 2019-03-03
  • 2 回答
  • 0 关注
  • 2863 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信