Question

我一直在互联网上寻找一个按钮的例子，点击该按钮会使按钮直接出现在按钮上方。这意味着覆盖框底部将与按钮顶部对齐。只是想知道是否有人有这样的例子？

Answer 1

很抱歉我的问题如此笼统。以下是我为获得积极结果而做的一些代码：

   <html>
    <head>
        <META HTTP-EQUIV="EXPIRES" CONTENT="-1" />
        <script type="text/javascript">
           function setVisibility(id) {
               if(document.getElementById('bt1').value=='Hide Layer'){
                  document.getElementById('bt1').value = 'Show Layer';
                  document.getElementById(id).style.display = 'none';
               }else{
                  document.getElementById('bt1').value = 'Hide Layer';
                  document.getElementById(id).style.display = 'inline';
               }
           }
        </script>
        <style type="text/css">

           #container {
                width:1px;
                height:1px;
                position: relative;
           }
           #nav,
           #data {
                display:block;  
                position:absolute;
                width:100%;
                bottom:100%; /* change to TOP and it will drop down */
                background: #fff;
           }

           #data{
                z-index: 10;
           }

    </style>
</head>
<body>
   <p>test text</p>
   <p>test text</p>
   <p>test text</p>
   <p>test text</p>
   <div id="container">
      <div id="nav"></div>
        <div id="data"  >
             blah<br>
             blah<br>
             blah<br>
             blah<br>
        </div>
   </div>
   <input type=button name=type id='bt1' value='Hide Layer'         
         onclick="setVisibility('data')";> 
   <script> setVisibility('data'); </script>
</body>
</html>

叠加显示在按钮上方

1 个答案: