How to implement this cool popup div effect using jQuery?

HTML :-

<div class='container'>

    <button id="btnShow">Show</button>

    <div class='menu' style='display: none'>

        <button id="btnHide">Close</button><br/>

       ABCDEFGHI,<br/>

        ABCDEFGHI<br/>

        ABCDEFGHI <br/>

        ABCDEFGHI<br/>

        ABCDEFGHI<br/>

        ABCDEFGHI <br/>

        ABCDEFGHI <br/>

    </div>

</div>

JS : - 

  $(document).ready(function() {

            $('#btnShow').click(function() {

 $('.menu').show().css("top", "400px").animate({ top: 50 }, 200);

            });

            $('#btnHide').click(function() {

                $('.menu').hide();

            });

  });

CSS :- 

.container

        {

            with: 400px;

            height: 300px;

            border: 1px solid black;

        }

    .menu

        {

            position: absolute;

            border: 1px solid black;

            background: #fff;

            left: 180px;

        }