js特效有关问题：请教小弟我怎么点击图片按钮后，显示其中一个div，其他div隐藏，求代码
js特效问题：请问我如何点击图片按钮后，显示其中一个div，其他div隐藏，求代码
点击图片按钮后，显示其中一个div，其他div隐藏，而点击另一个按钮后，同样是显示其中一个div，其他div隐藏
------解决思路----------------------
<script type="text/javascript" src="js/jquery.js"></script>
<script>
$().ready(function(){
$(".nav li").mouseover(function(){
var num=$(this).index();
$(".nav li div").css("display","none");
$(".nav li:eq("+num+") div").css("display","block");
})
$(".nav li").mouseout(function(){
$(".nav li div").css("display","none");
})
})
</script>
</head>
<body>
<div class="nav">
<ul>
<li>
<a href="">首页</a>
<div style="display:none;">
<a href="">信息1</a>
<a href="">信息2</a>
<a href="">信息3</a>
<a href="">信息4</a>
</div>
</li>
<li>
<a href="">网页</a>
<div style="display:none;">
<a href="">信息1</a>
<a href="">信息2</a>
<a href="">信息3</a>
<a href="">信息4</a>
</div>
</li>
<li><a href="">新闻</a>
<div style="display:none;">
<a href="">信息1</a>
<a href="">信息2</a>
<a href="">信息3</a>
<a href="">信息4</a>
</div>
</li>
<li><a href="">资讯</a>
<div style="display:none;">
<a href="">信息1</a>
<a href="">信息2</a>
<a href="">信息3</a>
<a href="">信息4</a>
</div>
</li>
<li>
<a href="">联系我们</a>
<div style="display:none;">
<a href="">信息1</a>
<a href="">信息2</a>
<a href="">信息3</a>
<a href="">信息4</a>
</div>
</li>
</ul>
</div>
</body>
</html>[/code]
点击图片按钮后，显示其中一个div，其他div隐藏，而点击另一个按钮后，同样是显示其中一个div，其他div隐藏
------解决思路----------------------
<!DOCTYPE>
<html>
<head>
<title>练习</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
[code=css]body{
margin:0;
padding:0;
}
a{
text-decoration:none;
}
.nav{
border:1px solid red;
width:600px;
margin:20px auto;
height:60px;
}
.nav ul li{
float:left;
margin-right:10px;
padding:0;
width:80px;
text-align:center;
list-style:none;
line-height:30px;
border:1px solid red;
}
.nav ul li div{
padding:10px;
}
<script type="text/javascript" src="js/jquery.js"></script>
<script>
$().ready(function(){
$(".nav li").mouseover(function(){
var num=$(this).index();
$(".nav li div").css("display","none");
$(".nav li:eq("+num+") div").css("display","block");
})
$(".nav li").mouseout(function(){
$(".nav li div").css("display","none");
})
})
</script>
</head>
<body>
<div class="nav">
<ul>
<li>
<a href="">首页</a>
<div style="display:none;">
<a href="">信息1</a>
<a href="">信息2</a>
<a href="">信息3</a>
<a href="">信息4</a>
</div>
</li>
<li>
<a href="">网页</a>
<div style="display:none;">
<a href="">信息1</a>
<a href="">信息2</a>
<a href="">信息3</a>
<a href="">信息4</a>
</div>
</li>
<li><a href="">新闻</a>
<div style="display:none;">
<a href="">信息1</a>
<a href="">信息2</a>
<a href="">信息3</a>
<a href="">信息4</a>
</div>
</li>
<li><a href="">资讯</a>
<div style="display:none;">
<a href="">信息1</a>
<a href="">信息2</a>
<a href="">信息3</a>
<a href="">信息4</a>
</div>
</li>
<li>
<a href="">联系我们</a>
<div style="display:none;">
<a href="">信息1</a>
<a href="">信息2</a>
<a href="">信息3</a>
<a href="">信息4</a>
</div>
</li>
</ul>
</div>
</body>
</html>[/code]