日期:2014-05-16  浏览次数:20324 次

关于在ie和firefox中层定位的问题
<div   id= "skinMenu ">
...
</div>
<div   id= "notice ">
<a   href= "# "   onmouseover= "changeSkin(event) "> 风   格 </a>
</div>

js代码:
function   changeSkin(event)
{
var   oDiv=document.getElementById( "skinMenu ");
oDiv.style.visibility= "visible ";
oDiv.style.left=event.clientX+ "px ";
oDiv.style.top=event.clientY+5+ "px ";
}

以上代码采用的是获取鼠标坐标来定位skinmenu的位置,但该方法会随着鼠标在该链接上的位置的移动而导致skinmenu层位置稍有所变化,   有点不美观。

  我现在想绝对定位skinmenu的位置(即skinmenu层固定在a标签下面,不管onmouseover在a标签的哪个地方激活),按照我的思路是获取a标签在页面中的坐标再定位skinmenu层(具体效果类似于动网论坛上的导航弹出菜单)
    烦请高手分析并指教!!并贴出代码


------解决方案--------------------
<div id= "skinMenu " style= "position:absolute;display:none;z-index:100 ">
<!--该层绝对定位,初始为隐藏//-->
...
asdfas
afs
</div>

<div id= "notice ">
<a href= "# " onmouseover= "changeSkin(event,this) " onmouseout=document.getElementById( "skinMenu ").style.display= 'none '> 风 格 </a>
</div>
aasdfasdfsdfasd
asdfsdf
<script>
function changeSkin(event,o)
{
//alert(o.offsetTop);
var oDiv=document.getElementById( "skinMenu ");
oDiv.style.top = o.offsetTop+o.offsetHeight+ "px "//当前对象在屏幕中的顶坐标和高度
oDiv.style.left = o.offsetLeft+ "px "
oDiv.style.display= "block ";
}
</script>
------解决方案--------------------
试用position:absolute和z-index两个定位试一下吧。
------解决方案--------------------
那你其他的定位有用到position和z-index么?其中z-index的属性是相对于z-index值比它小的。