Blog Content

    티스토리 뷰

    51.jQuery - slideToggle()로 지정된 영역 보이고 안보이게 하기 ( 08.Effects )

    반응형
    SlideToggle (speed, callback) : 슬라이드 업/다운에 대한 토글링

    04.SlideToggle.htm

    <html xmlns="http://www.w3.org/1999/xhtml">

    <head>

        <title>슬라이드 /다운</title>

        <style type="text/css">

        </style>

       

        <script src="../jQuery/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>

        <script type="text/javascript">

            $(document).ready(function() {

                $("#btn").click(function() {

                    //[!1] 숨김-보임-숨김

                    $("#first").slideToggle('slow');

                });

            });

        </script>

    </head>

     

    <body>

        <input type="button" id="btn" value="슬라이드 토글" />

       

        <div id="first" style="display:none; background-color:Yellow; height:100px;">

             첫번째 영역

        </div>

    </body>

    </html>


    결과화면

    [그림51-1]



    반응형

    Comments