急用 js 层的显示隐藏

现在有一个需求，外面一个大层，大层里有两个小层，层1默认显示，层2默认隐藏，鼠标移动到大层上时，层2显示，层1隐藏，层2上有链接，请教各位，急用。。

解决方案 »

  1.   

    <div onmouseover="javascript:document.getElementById('div1').style.display='none';document.getElementById('div2').style.display=''">
    <div id="div1">d</div>
    <div id="div2"  style="display:none">f</div>
    </div>
      

  2.   

    <html>
    <script language="javascript" >
      function ShowDiv()
      {
       document.getElementById("div11").style.display="none";
       document.getElementById("div12").style.display="block";
      }
      function HiddDiv()
      {
       document.getElementById("div11").style.display="block";
       document.getElementById("div12").style.display="none";
      }
    </script>
    <body>
    <div id="div1" style="width:300px; height:300px; background-color:yellow;" onmouseover="ShowDiv();" onmouseout="HiddDiv();">
    <div id="div11" style="width:100px; height:300px;display:block; background-color:red;">
    div1
    </div>
    <div id="div12" style="width:150px; height:300px;display:none; background-color:grey;">
    <a href="#"><span>div2</span></a>
    </div>
    </div>
    </body><html>
      

  3.   

    [code:html]<html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=GBK" />
    <title>无标题文档</title>
    <script src="../../开发环境/jquery-1.4.2.js" type="text/javascript"></script>
    <script type="text/javascript">
    function change(){
      $("#a").hide();
      $("#b").show();
    }</script>
    </head><body>
        <div id="test" onMouseOver="change()" >
       <div id="a" >
          <input type="text" value="默认显示"/>
       </div>
       <div id="b">
          <a href="http://www.baidu.com" >超链接</a>
       </div>
    </div>
    </body>
    </html>
    [/code]
      

  4.   

    上面弄错了 修改下发给你看
    <code:html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=GBK" />
    <title>无标题文档</title>
    <script src="../../开发环境/jquery-1.4.2.js" type="text/javascript"></script>
    <script type="text/javascript">
    window.onload=function(){
      $("#b").hide();
    }
    function change(){
      $("#a").hide();
      $("#b").show();
    }</script>
    </head><body>
        <div id="test" onMouseOver="change()" >
       <div id="a" >
          <input type="text" value="默认显示"/>
       </div></br>
       <div id="b">
          <a href="http://www.baidu.com" >超链接</a>
       </div>
    </div>
    </body>
    </html>
    </code>