点击显示或隐藏 slideDown/slideUp

来源:互联网 发布:劳动收入份额数据 编辑:程序博客网 时间:2024/06/06 13:09
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <script type="text/javascript" src="js/jquery-2.1.0.js">
            
        </script>
        <script type="text/javascript">
            $(function(){
                $("button:eq(0)").click(function(){
                    $("div").slideDown();
                });
                $("button:eq(1)").click(function(){
                    $("div").slideUp();
                });
                $("button:eq(2)").click(function(){
                    $("div").slideToggle();
                });
            });
        </script>
        <style type="text/css">
            div {
                width: 200px;
                height: 200px;
                background: pink;
            }
        </style>
    </head>
    <body>
        <button>显示</button>
        <button>隐藏</button>
        <button>切换</button>
        <div></div>
    </body>
</html>

原创粉丝点击