CodePen

HTML

            
              <div class="dropdown-cart">
  <h3>Shopping Cart</h3>
</div>
            
          
!

CSS

            
              *{padding:0px;
margin:0px}
.dropdown-cart
{width:200px;
min-height:200px;
max-height:auto;
background:#999;
position:absolute;
right:5px;
top:0}

h3
{display:block;
line-height:30px;
text-align:center;
background:#111;
font-family:arial;
color:#ccc;
text-shadow:0 1px 0px #fff;
margin-top:170px;
  cursor:pointer
}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              $(".dropdown-cart h3").toggle(function(){
		$(".dropdown-cart").animate({
           top:'0'
        }, 500, 'swing', function(){
      });
      },function(){
          $(".dropdown-cart").animate({
          top:'-170'
      }, 500, 'swing',function(){
    });
});
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................