1. 程式人生 > >html導航隱藏顯示

html導航隱藏顯示

cli AD hidden html click 隱藏 doc pos head

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery-1.11.3.min.js" ></script>
</head>
<script>
$(function(){
$("dd").hide();
$("dt").click(function(){
if($(this).next().is(":hidden"))
{
$(this).next().slideDown(1000);
}else
{
$(this).next().slideUp(1000);
}
});
});
</script>
<body>
<dl>
<dt>產品中心</dt>
<dd>
<div>產品</div>
<div>產品</div>
<div>產品</div>
</dd>
<dt>新聞中心</dt>
<dd>
<div>新聞</div>
<div>新聞</div>
<div>新聞</div>
</dd>
<dt>金錢中心</dt>
<dd>
<div>金錢</div>
<div>金錢</div>
<div>金錢</div>
</dd>

</dl>
</body>
</html>

html導航隱藏顯示