鼠标指上去弹出层 如何让弹出层里的图片能够遮住border边框
我现在实现了一个效果，如下：
我现在想要实现的效果是那张图片可以遮盖住绿色的边框，我之前试过，用相对位置，还有设置z-index都不行，这个效果有个css样式，我觉得可能和里面的某个设置有关，但是不知道怎么改，现贴上代码，大家帮忙看看
<div class="wrapper">
<div class="main">
<div class="maincontent">
<div class="topblock">
<div class="nav homenav" id="nav">
<ul>
<li style="background-color:#D1D1D1; "><a href="http://www.jq-school.com?electronics-642/" >数码产品、配件</a>
<div class="submenubox disn">
<div class="subcate">
<ul>
<li><a href="http://www.jq-school.com?electronics-642/category/digitalcamera-644/" >数码相机</a></li>
</ul>
</div>
</div>
</li>
<li style="background-color:#D1D1D1;"><a href="http://www.jq-school.com?computers-553/" >电脑、硬件</a>
<div class="submenubox disn" style="left: 200px; top: -41px">
<div class="subcate">
<ul>
<li><a href="http://www.jq-school.com?computers-553/category/laptop-600/" >笔记本</a></li>
</ul>
</div>
</div>
</li>
<li style="background-color:#D1D1D1;"><a href="http://www.jq-school.com?officedevice-673/" >办公设备、耗材</a>
<div class="submenubox disn" style="left: 201px; top: -83px; ">
<div class="subcate">
<ul>
<li><a href="http://www.jq-school.com?officedevice-673/category/project-608/" >投影仪</a></li>
</ul>
</div>
</div>
</li>
<li style="background-color:#D1D1D1;"><a href="http://www.jq-school.com?communication-666/" >手机通讯、配件</a>
<div class="submenubox disn" style="left: 201px; top: -107px;">
<div class="subcate">
<ul>
<li>
<a href="Default.aspx" target="_blank">手机</a> <a href="Default.aspx" target="_blank">通讯</a>
<div>
<img id="pop1" src="images/test.png" alt="鼠标指上去弹出层 怎么让弹出层里的图片能够遮住border边框" class="pop" style="width: 446px; height: 361px; left: 39px; top: 0px;position:relative;" /></div>
</li>
</ul>
</div>
</div>
</li>
</ul>
</div>
</div>
<!--end topblock -->
<div class="cl"></div>
</div>
</div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript" src="js/topMenu.js?113"></script>
在头部有个css：
<link href="css/common.css" rel="stylesheet" type="text/css" media="all" />
*{ margin:0; padding:0;}
body{min-width:970px;}
img{ border:0px;}
ul{ list-style:none;}
.cl,.clr{ clear:both; height:0px; font-size:0;}
.disn{ display:none;}
.disb{ display:block;}
h1,h2,h3,h4,h5,h6{font-size:13px; font-weight:bold;}
a:link,a:visited,a:hover,a:active{ color:#333333; text-decoration:none;font-size:12px;}
a:hover{ text-decoration:underline;color:#333333; font-size:12px;}
.header{height:149px;}
.header .headercontent{width:985px; margin:0 auto;}
.header .logo{height:55px; width:285px; overflow:hidden; padding:24px 0 2px 15px; margin-bottom:17px; float:left;}
.topnav{clear:both;}
.accoutbar{text-align:right;padding:17px 5px 0 0;}
.topnav .topallcate{float:left;position:relative;z-index:9999;}
.topnav .topallcate .nav{position:absolute;top:0;left:-2px;width:210px;z-index:9999;}
.nav .allcate{position:absolute;top:0;left:1px;z-index:101;}
.nav .allcate a{display:block;width:210px;height:39px;text-indent:-9999px;overflow:hidden;}
.nav .allcate a.hover{background-position:-210px -381px}
.topnav .nav ul{margin-top:39px;}
.nav ul{margin-top:50px; margin-left:10px;}
.nav ul li{height:42px; line-height:42px; padding:0 0 0 13px; position:relative; z-index:100;}
.nav ul li.over{background-position:-203px -246px;}
.nav ul li a:link,.nav ul li a:active,.nav ul li a:visited{font-size:15px; padding-left:12px;color:#333;}
.nav ul li a:hover{font-size:15px; padding-left:12px; color:red;}/*鼠标指上去字体变颜色 */
.nav ul li a strong{font-weight:normal;}
.nav ul li.over a:link,.nav ul li.over a:active,.nav ul li.over a:visited,.nav ul li.over a:hover{font-size:15px; padding-left:12px; color:red;}/*鼠标指上去字体变颜色 */
.nav .submenubox{position:absolute; left:189px; top:1px; width:425px;border:#83b712 2px solid; float:left; line-height:0; overflow:hidden;}
.nav .submenuboxBottom{top:auto;bottom:1px;}
.nav .submenubox .subcate{width:450px;height:200px; float:left;}/*绿色框宽度 */
.nav .submenubox .subcate ul{border:0; margin:0; padding:2px 0; margin-bottom:-2000px; padding-bottom:2000px; position:relative;}/*绿色框背景色 */
.nav .submenubox .subcate ul li{ background:none; height:auto; line-height:18px; padding:5px 0 5px 0px; position:static; z-index:auto; cursor:default;}
.nav ul li.over .subcate ul li a:link,.nav ul li.over .subcate ul li a:active,.nav ul li.over .subcate ul li a:visited{ font-size:14px; padding-left:12px; color:#333333;}
.nav ul li.over .subcate ul li a:hover{ color:#333333;}
.nav ul li.last .submenubox .subcate{ width:420px;}
.nav ul li.last .submenubox .subcate ul{ background:none; float:left;}
.nav ul li.last .submenubox .subcate ul li{ float:left; width:139px;}
.nav ul li.last .subcate ul li a:link,.nav ul li.last .subcate ul li a:active,.nav ul li.last .subcate ul li a:visited{ font-size:14px; padding-left:12px; color:#585858;}
.nav ul li.last .subcate ul li a:hover{ color:#669900;}
.searchbox{width:483px; height:58px; margin-left:448px; padding-top:14px;position:relative; z-index:99;}
.searchbox .l{ padding-left:36px; height:58px;}
.searchbox .m{ height:58px; }
.searchbox .m .searchkey{ outline:none; border:0; padding:16px 0; height:22px; line-height:22px; background:none; font-size:19px; font-weight:bold; color:#98bc00; width:290px; float:left;font-family: "microsoft yahei";}
.searchbox .m .searchcleanbut{cursor:pointer; border:0; width:20px; height:58px; float:left;}
.searchbox .m .searchbut{ cursor:pointer; border:0; width:154px; height:58px; float:right;}
.searchbox .m .searchbutfocus{ background-position:-154px -115px;}
.header .hotkeywords{ margin-left:486px; padding:6px 0 0 0; color:#6f6f6f; height:15px; overflow:hidden; line-height:15px; width:495px;}
.header .hotkeywords a:link,.header .hotkeywords a:visited,.header .hotkeywords a:active{ color:#6f6f6f;}
.header .hotkeywords a:hover{ color:#669900;}
.wrapper{clear:both; margin:0 auto; padding-top:4px; max-width:1080px; _width:1010px; }
.wrapper .main{width:970px; margin:0 auto; background:#fff;min-height:580px; _height:580px;}
.mainbot{height:16px; font-size:0; margin:0 auto; max-width:1080px; _width:1010px;}
body{min-width:1210px; }
body,p,div,th,td,input,select,textarea,ul,li,a{font-family:"microsoft yahei","瀹",Arial,Verdana;}
.header{ height:115px; background-position:0 0;}
.header .headercontent{ width:1210px; margin:0 auto;}
.header .logo{padding:24px 0 2px 33px; float:left;}
.searchbox{width:653px;}
.searchbox .m .searchkey{border:0; padding:18px 0; height:22px; line-height:22px; background:none; font-size:19px; font-weight:bold; color:#98bc00; width:460px; float:left;}
.header .hotkeywords{ width:auto;}
.wrapper{ background:url(../images/v5_maintop_bg_home.png) no-repeat center 0; max-width:none; _width:auto;}
.wrapper .main{width:1210px; margin:0 auto; background:#fff; padding-top:0;}
.mainbot{ background:url(../images/main_bot_bg_home.png) no-repeat center 0; max-width:none; _width:auto;}
.topblock{ padding:12px 12px 0 4px;}
.nav{ width:210px; float:left; position:relative; z-index:101;}
.nav .allcate{ left:0;}
.nav .allcate a{ display:block; width:210px; height:58px; background:url(../images/v5_main_img.png) no-repeat 0px -173px; text-indent:-9999px;}
.topblock .colr{ width:971px; float:left; margin-left:13px;}
.topblock .smarteraccount{ float:right; padding:9px 0;}
.topblock .smarteraccount a{ display:block; float:left; margin:0 5px; width:135px; height:51px;background:url(../images/v5_main_img.png) no-repeat 0 -324px; text-indent:-9999px;}
.topblock .smarteraccount a.login{ background-position:0 -324px;}
.topblock .smarteraccount a.register{ background-position:-145px -322px;}
.topblock .logined{float:right; width:265px; height:32px; line-height:16px; padding:14px 10px; background:#e9fac3 url(../images/v5_repeat_x.png) repeat-x 0px -837px; margin-bottom:6px; border-right:#dbf4a0 1px solid; border-bottom:#dbf4a0 1px solid; }
.topblock .logined strong{ color:#c00;}
.topblock .logined p{ padding:5px 0 0 0; color:#a4a4a4;}
大家帮忙看看到底怎么改啊？注：里面的js贴在下面
[解决办法]
这个必须绝对定位啊