帮我改哈代码,刚学jquery,比较菜
页面就是分了两大块,点大类的时候子内容就显示,鼠标划入li的时候颜色发生了改变
现要2处要改下,1:比如当点电子秤的时候 如果下面高清电视 子内容如果是展开的,就收缩回来,反之亦然
2:当鼠标划入li的时候颜色发生了改变,划入到另外一个模块li的时候 先前li的时候颜色就remove
也许语言说的不是很清楚,大家帮我的代码COPY到DW里就明白了,,谢谢
<style type="text/css">
ul li ul li{
list-style:none;
width:150px;
background:#fff000;
height:25px;
line-height:25px;
}
.tree{
width:600px;
background:#CCCCCC;
}
.change{
background:#3399CC;
}
</style>
</head>
<body>
<div class="tree">
<ul>
<li>
<span>电子秤</span>
<ul>
<li>电子健康秤</li>
<li>人体脂肪检测仪</li>
<li>红外人体脂肪检测仪</li>
<li>人体脂肪水份检测仪</li>
<li>手提秤</li>
<li>口袋秤</li>
<li>婴儿秤 </li>
<li>配餐秤 </li>
</ul>
</li>
</ul>
<ul>
<li>
<span >高清播放器</span>
<ul>
<li>A1系列</a></li>
<li>B1系列</li>
<li>C1系列</li>
</ul>
</li>
</ul>
</div>
</body>
<script type="text/javascript">
$(function(){
$(".tree ul li ul").hide();
$(".tree ul li span").click(function(){
$(this).next().show()
})
})
</script>
<script type="text/javascript">
$(".tree ul li ul li").mouseover(function(){
$(this).css("background","#ffffff")
$(this).siblings().css("background","#ffff00")
}
)
</script>
------解决方案--------------------
JScript code
$(function() {
$(".tree ul li ul").hide();
$(".tree ul li span").click(function() {
$(".tree ul li ul").hide();
$(this).next().show()
});
});
$(".tree ul li ul li").mouseover(function() {
$(".tree ul li ul li").css("background-color", "#FF0");
$(this).css("background-color", "#FFF");
});