jquery做div从下往上移动

/* 页面最外面的div */
          #pop {
              position: relative;
              overflow: hidden;
          }

需要做动画的div外需包一层div（对于table表格）

.box {
              position: absolute;
              right: 40px;
              display: none;
          }

var pop = document.getElementById("pop")
var box = document.getElementsByClassName('box')[0]
var flag = true
$('#but').click(function() {
    var height = $(window).height(); //获取浏览器高度
    pop.style.height = height + 'px'
    box.style.bottom = '-' + height + 'px'
    if (flag) {
        $('.box').css("display", 'block')
        $('.box').animate({ //设置动画
            bottom: 40 + 'px',
        }, 1000)
            flag = false
        } else { //隐藏
            $('.box').css({
                  "display": 'none',
                'bottom': '40px'
            })
                flag = true
            }
        })