3
<style>
 .h,.e {list-style-type: none; float:left;}
 .h div,.e div{background-color:gray; padding:2px 20px;margin:1px;}
 #h1,#e1{background-color:yellow; padding:2px 20px;margin:5px; visibility:hidden;
 }

<ul>
  <li class="h">
    <div id="h">Home</div>
    <ul class="h1" id="h1"><li>H1</li><li>H2</li><li>H3</li><li>H4</li></ul>
  </li>
  <li  class="e">
    <div id="e">Exit</div>
    <ul class="e1" id="e1"><li>E1</li><li>E2</li><li>E3</li><li>E4</li></ul>
  </li>
<ul>

<script>
  var oh = document.getElementById("h");
  var oe = document.getElementById("e");
  var oh1 = document.getElementById("h1");
  var oe1 = document.getElementById("e1");

  oh.onmouseover=function(){oh1.style.visibility="";};
  oe.onmouseover=function(){oe1.style.visibility="";};
</script>

在鼠标悬停时,我想显示 id=h1,e1 项目,但它不起作用....,代码出了什么问题?

4

4 回答 4

0

试试visible

oh1.style.visibility="visible";
于 2012-05-29T18:21:28.557 回答
0
<script>
  var oh = document.getElementById("h");
  var oe = document.getElementById("e");
  var oh1 = document.getElementById("h1");
  var oe1 = document.getElementById("e1");

  oh.onmouseover=function(){oh1.style.display="block";};
  oe.onmouseover=function(){oe1.style.display="block";};
</script>
于 2012-05-30T03:34:31.933 回答
-1

尝试:

oh1.style.visibility="visible";

应该是一个非常明显的修复,但至于解释 - 将可见性设置为“”是没有价值的 - 因此不会有任何变化,“可见”是一个可接受的值,并将显示 oh1 对象。

于 2012-05-29T18:20:52.737 回答
-1

使用 jQuery:http: //jsfiddle.net/JqvSL/8/

它让你的生活更轻松,代码看起来干净了 10 倍。您可以使用opacitydisplay隐藏块,但visibility也适用于 jQuery。

于 2012-05-29T18:26:13.720 回答