[新人]鼠标移到img上，显示div，离开img时div隐藏，如果离开img但是还在显现的div上则不隐藏，现在有关问题是显现出来的div会撑开整个容器
[新人]鼠标移到img上，显示div，离开img时div隐藏，如果离开img但是还在显现的div上则不隐藏，现在问题是显现出来的div会撑开整个容器。
代码如下：
现在出校的效果就是，在图片下面的“aaaaaaaaaaaaaaaaa”，会被显示出来的div给撑到下面，我想要的效果是，显示出来的div遮盖在“aaaaaaaaaaaaaaaaa”，chrom用上面的方式可以兼容，ie和FF会把“aaaaaaaaaaaaaaaaa”撑下来，请问遮盖JS要怎么修改才能达到显示出来的div遮盖到“aaaaaaaaaaaaaaaaa“的div上面。
------解决方案--------------------
代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="show_div.css" />
<script src="jquery-2.1.1.min.js" type="text/javascript"></script>
<style type="text/css">
.show_div{ display: block;margin: 0 auto;width: 500px;height: 250px;border: 1px solid #ccc;display: none;clear: both;}
.show_img {width: 200px;margin-left: 25px;float: left;}
.show_img span{ display:block;text-align:center;}
</style>
<script type="text/javascript">
$(document).ready(function() {
$('#show').hover(function(){
$('#box').show();
}, function(){
$('#box').hide();
});
$('#box').hover(function(){
$(this).show();
}, function(){
$(this).hide();
});
});
</script>
</head>
<body>
<div style="margin: 0 auto; width: 160px; height: auto; ">
<p>扫一下,优惠多多！</p>
<img src="erweima.jpg" id="show" href="javascript:void(0);" >
</div>
<div id="box" class="show_div">
<div class="show_img">
<img src="ct_app.png" alt="xxxx手机版">
<span>xxxx手机版</span>
</div>
<div class="show_img">
<img src="ct_store.png" alt="xxxxx城">
<span>xxxx城</span>
</div>
</div>
<div style="margin: 0 auto; width: 160px; height: 20px;">aaaaaaaaaaaaaaaaa</div>
</body>
现在出校的效果就是，在图片下面的“aaaaaaaaaaaaaaaaa”，会被显示出来的div给撑到下面，我想要的效果是，显示出来的div遮盖在“aaaaaaaaaaaaaaaaa”，chrom用上面的方式可以兼容，ie和FF会把“aaaaaaaaaaaaaaaaa”撑下来，请问遮盖JS要怎么修改才能达到显示出来的div遮盖到“aaaaaaaaaaaaaaaaa“的div上面。
------解决方案--------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="show_div.css" />
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.4.2.min.js"></script>
<style type="text/css">
.show_div{ display: block;margin: 0 auto;width: 500px;height: 250px;border: 1px solid #ccc;display: none;clear: both;position:absolute;background:#fff;margin-left:-250px;left:50%;}
.show_img {width: 200px;margin-left: 25px;float: left;}
.show_img span{ display:block;text-align:center;}
</style>
<script type="text/javascript">
$(document).ready(function () {
$('#show').hover(function () {
$('#box').show();
}, function () {
$('#box').hide();
});
$('#box').hover(function () {
$(this).show();
}, function () {
$(this).hide();
});
});
</script>
</head>
<body>
<div style="margin: 0 auto; width: 160px; height: auto;position:relative ">
<p>扫一下,优惠多多！</p>
<img src="erweima.jpg" id="show" href="javascript:void(0);" alt="img">
<div id="box" class="show_div">
<div class="show_img">
<img src="ct_app.png" alt="xxxx手机版">