网页设计中,如何实现点击收起,点击展开? 好像是移位什么的

如题所述

第1个回答  2014-06-24
这个有方法的嘛,都是使用了一些js代码的 点击的时候就隐藏了一些内容,然后再点击就显示出一些内容。不过这样写的话有点麻烦了, 所以我们一把使用一般使用一些js框架例如JQuery.js 这样的话,只需要得到对象.toggle();就可以实现那个功能了。 $("#对象ID").toggle();本回答被提问者采纳
第2个回答  2016-05-31

    比较简单的是用到jquery中的alideToggle(“show”);

    你可以吧下面的代码复制到html文件中查看效果


    <!DOCTYPE html>

    <html>

    <head>

    <script src="/jquery/jquery-1.11.1.min.js"></script>

    <script type="text/javascript"> 

    $(document).ready(function(){

    $(".flip").click(function(){

        $(".panel").slideToggle("slow");

      });

    });

    </script>

     

    <style type="text/css"> 

    div.panel,p.flip

    {

    margin:0px;

    padding:5px;

    text-align:center;

    background:#e5eecc;

    border:solid 1px #c3c3c3;

    }

    div.panel

    {

    height:120px;

    display:none;

    }

    </style>

    </head>

     

    <body>

     

    <div class="panel">

    <p>W3School - 领先的 Web 技术教程站点</p>

    <p>在 W3School,你可以找到你所需要的所有网站建设教程。</p>

    </div>

     

    <p class="flip">请点击这里</p>

     

    </body>

    </html>

本回答被网友采纳
相似回答