<html>
<head>
<title>javascript-1</title>
<style>
*{padding:0px;margin:0px;}
.cd{
width:200px;
}
.cd_title{
cursor:hand;
width:100%;
}
.cd_main{
margin-left:30px;
width:100%;
filter:blendTrans(Duration=0.5);
}
ul,li{
list-style:square inside;
}
.cd_main li{
padding-left:10px;
}
</style>
<script>
function aa(obj){
obj.parentElement.childNodes[1].filters.blendTrans.apply();
obj.parentElement.childNodes[1].style.display=(obj.parentElement.childNodes[1].style.display=="none"?"block":"none");
obj.parentElement.childNodes[1].filters.blendTrans.play();
}
</script>
</head>
<body>
<div class="cd" style="background:red;">
<div class="cd_title" οnclick="aa(this)" style="background:blue;">
title1
</div>
<div class="cd_main" style="display:none; background:green;">
sdfsdf
</div>
</div>
<div class="cd">
<div class="cd_title" οnclick="aa(this)">
title
</div>
<div class="cd_main" style="display:none;">
<ul>
<li>
<div class="cd">
<div class="cd_title" οnclick="aa(this)">
title
</div>
<div class="cd_main" style="display:none;">
<ul>
<li>
<div class="cd">
<div class="cd_title" οnclick="aa(this)">
title
</div>
<div class="cd_main" style="display:none;">
<ul>
<li>
<input type="checkbox" name="idBox">
123</li>
<li><input type="checkbox" name="idBox">123</li>
<li>
<div class="cd">
<div class="cd_title" οnclick="aa(this)">
title
</div>
<div class="cd_main" style="display:none;">
<ul>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
</ul>
</div>
</div>
</li>
<li>123</li>
</ul>
</div>
</div>
</li>
<li>123</li>
<li>123</li>
<li>123</li>
</ul>
</div>
</div>
</li>
<li>
<div class="cd">
<div class="cd_title" οnclick="aa(this)">
title
</div>
<div class="cd_main" style="display:none;">
<ul>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
</ul>
</div>
</div>
</li>
<li>123</li>
<li>123</li>
</ul>
</div>
</div>
</body>
</html>
<head>
<title>javascript-1</title>
<style>
*{padding:0px;margin:0px;}
.cd{
width:200px;
}
.cd_title{
cursor:hand;
width:100%;
}
.cd_main{
margin-left:30px;
width:100%;
filter:blendTrans(Duration=0.5);
}
ul,li{
list-style:square inside;
}
.cd_main li{
padding-left:10px;
}
</style>
<script>
function aa(obj){
obj.parentElement.childNodes[1].filters.blendTrans.apply();
obj.parentElement.childNodes[1].style.display=(obj.parentElement.childNodes[1].style.display=="none"?"block":"none");
obj.parentElement.childNodes[1].filters.blendTrans.play();
}
</script>
</head>
<body>
<div class="cd" style="background:red;">
<div class="cd_title" οnclick="aa(this)" style="background:blue;">
title1
</div>
<div class="cd_main" style="display:none; background:green;">
sdfsdf
</div>
</div>
<div class="cd">
<div class="cd_title" οnclick="aa(this)">
title
</div>
<div class="cd_main" style="display:none;">
<ul>
<li>
<div class="cd">
<div class="cd_title" οnclick="aa(this)">
title
</div>
<div class="cd_main" style="display:none;">
<ul>
<li>
<div class="cd">
<div class="cd_title" οnclick="aa(this)">
title
</div>
<div class="cd_main" style="display:none;">
<ul>
<li>
<input type="checkbox" name="idBox">
123</li>
<li><input type="checkbox" name="idBox">123</li>
<li>
<div class="cd">
<div class="cd_title" οnclick="aa(this)">
title
</div>
<div class="cd_main" style="display:none;">
<ul>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
</ul>
</div>
</div>
</li>
<li>123</li>
</ul>
</div>
</div>
</li>
<li>123</li>
<li>123</li>
<li>123</li>
</ul>
</div>
</div>
</li>
<li>
<div class="cd">
<div class="cd_title" οnclick="aa(this)">
title
</div>
<div class="cd_main" style="display:none;">
<ul>
<li>123</li>
<li>123</li>
<li>123</li>
<li>123</li>
</ul>
</div>
</div>
</li>
<li>123</li>
<li>123</li>
</ul>
</div>
</div>
</body>
</html>