记一次CSS弹出动画的Bug

在写 jQuery WeUI 的一个picker的弹出动画的时候，我是通过CSS动画实现的。

CSS代码如下：

.weui-picker-modal {
  width: 100%;
  position: absolute;
  z-index: 100;
  bottom: 0;
  text-align: center;
  border-radius: 0;
  opacity: 0.6;

  color: @color-text;
  transition-duration: .3s;
  height: 13rem;
  background: #EFEFF4;

  transform: translate3d(0, 100%, 0);
  transition-property: transform, opacity;

  &.weui-picker-modal-visible {
    opacity: 1;
    transform: translate3d(0,0,0);
  }
}

JS代码如下：

$.openPicker = function(tpl) {

    var container = $("<div class='weui-picker-container'></div>").appendTo(document.body);
    container.show();

    container.addClass("weui-picker-container-visible");

    //关于布局的问题，如果直接放在body上，则做动画的时候会撑开body高度而导致滚动条变化。
    var dialog = $(tpl).appendTo(container)