Question

用JS做鼠标滑动显示DIV、鼠标滑开隐藏DIV banner_son和banner_son2设置为隐藏了 JS代码怎么写？

<div id="banner">
<table width="720" border="0">
<tr>
<td width="120"><a href="#" id="menu1">所有商品</a></td>
<td width="120"><a href="#">首 页</a></td>
<td width="120"><a href="#" id="menu2">新鲜水果</a></td>
<td width="120"><a href="#">酒水饮料</a></td>
<td width="120"><a href="#">零食干货</a></td>
<td width="120"><a href="#">特 产</a></td>
</tr>
</table>
</div>
<div id="banner_son">
<table width="700" border="0">
<tr>
<td><a href="#">苹果</a></td>
<td><a href="#">橙子</a></td>
<td><a href="#">提子</a></td>
<td><a href="#">奇异果</a></td>
<td><a href="#">草莓</a></td>
<td><a href="#">苹果</a></td>
<td><a href="#">橙子</a></td>
<td><a href="#">提子</a></td>
<td><a href="#">奇异果</a></td>
<td><a href="#">草莓</a></td>
</tr>
</table>
</div>
<div id="banner_son2">
<table width="700" border="0">
<tr>
<td><a href="#">苹果</a></td>
<td><a href="#">橙子</a></td>
<td><a href="#">提子</a></td>
<td><a href="#">奇异果</a></td>
<td><a href="#">草莓</a></td>
<td><a href="#">苹果</a></td>
<td><a href="#">橙子</a></td>
<td><a href="#">提子</a></td>
</tr>
</table>
</div>
鼠标滑动到所有商品时，banner_son显示 鼠标滑动到新鲜水果时，banner_son2显示

Answer 1

JQuery的写法，可以帮你写一个，试试吧：
//首先要确定你的banner_son和banner_son2都是隐藏的，并且隐藏的写法为display:none;属性。
$(function(){
$("#menu1").mouseenter(function(){
$("#banner_son").show();

}).mouseleave(function(){
$("#banner_son").hide();

});
$("#menu2").mouseenter(function(){
$("#banner_son2").show();
}).mouseleave(function(){
$("#banner_son2").hide();
})})