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

菜鸟求助(滑动门问题)!
一个js做的滑动门,最终效果有几个问题,想请教各位师兄。
问题一:鼠标不悬停在内容区域,则内容区域为空白。

问题二:第一次将指针悬停在标题区域的新闻二部分时,新闻一内容未隐藏。
(请问如何修改为正常效果?)

HTML code

<script type="text/javascript">
function showTopNav(layerName){
    eval('document.getElementById('+ "'" + layerName + "'" +').style.display = "block"');
}
function hideTopNav(layerName){
    eval('document.getElementById('+ "'" + layerName + "'" +').style.display = "none"');
}
</script>

</head>

<body>
<ul class="s1">
    <li onmouseover="showTopNav('new1')" onmouseout="hideTopNav('new1')"><a href="#">新闻一</a>
        <ul id="new1">
            <li><a href="#">新闻一</a></li>
            <li><a href="#">新闻一</a></li>
            <li><a href="#">新闻一</a></li>
        </ul>
    </li>
    <li onmouseover="showTopNav('new2')" onmouseout="hideTopNav('new2')"><a href="#">新闻二</a>
        <ul id="new2" style=" position:absolute; top:43px; left:0px;">
            <li><a href="#">新闻二</a></li>
            <li><a href="#">新闻二</a></li>
            <li><a href="#">新闻二</a></li>
        </ul>
    </li>
</ul>   



------解决方案--------------------
呃,不是很明白你的意思,不过你那代码根本不用eval()呀
JScript code
<script type="text/javascript">
function showTopNav(layerName){
    document.getElementById(layerName).style.display = "block";
}
function hideTopNav(layerName){
    document.getElementById(layerName).style.display = "none";
}
</script>