Yardımlarınızı bekliyorum.
<div style="width: 213px;margin-bottom:5px;border-left:#dce8ee 1px solid;border-right:#dce8ee 1px solid;"><div class="AnaKategori" style="padding-top:5px;font-weight:bold;font-size:15px;cursor:pointer;width:198px;display:block; border-left:1px solid #dce8ee; border-right:1px solid #dce8ee; padding-left:15px;"><a style="color:#555;display: block;" href="javascript:void(0);" onclick="$(this).parent().parent().next().css('display') != 'none' ? $(this).parent().parent().next().hide() : $('.SubMenu').hide() && $(this).parent().parent().next().show();">{%BASLIK%}</a></div></div>
<div class="SubMenu" style="display: none;">{%ICERIK%}</div>
<style>
.AnaKategori{
font-weight:bold;
border:#99CCFF 1px solid;
background-color: #FFFF99;
margin-left: 10px;
margin-bottom: 0px;
display: list-item;
padding: 2px;
}
.AnaKategori a:HOVER{
text-decoration: none;
}
.SubMenu .SubMenuItem{
display: block;
font-weight:bold;
border:#99CCFF 1px solid;
background-color: #FF9999;
margin-left: 15px;
margin-right: 15px;
margin-bottom: 2px;
font-weight:bold;
font-size:12px;
cursor:pointer;
color: #555555;
padding: 10px;
}
.SubMenu table{
width: 100%;
}
.SubMenu a{
padding: 2px;
display: block;
color: #555555
}
.SubMenu a:HOVER{
text-decoration: none;
}
}
</style>
<script>
$(".AnaKategori").mouseover(function(){
$(this).css("background-color", "#FF9999");
}).mouseleave(function(){
$(this).css("background-color", "#FFFF99");
});
$(".SubMenuItem a").mouseover(function(){
$(this).css("background-color", "#FFFF99");
}).mouseleave(function(){
$(this).css("background-color", "#FF9999");
});
</script>