Полоса прокрутки отображается через анимацию/переход CSS

Я оживляю свой ng-view в Angular с кубическим безье:

/* Animations */
.slide-animation.ng-enter, .slide-animation.ng-leave  {
  -webkit-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
  -moz-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
  -o-transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
  transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;

  position:absolute;
}

.slide-animation.ng-enter {
  opacity:0;
  left:300px;
  overflow-y: hidden;
  overflow-x:hidden;
}

.slide-animation.ng-enter.ng-enter-active {
  opacity:1;
  left: 0;
  top: 0;
}

.slide-animation.ng-leave {
  opacity:0;
  left: 0;
  top: 0;
}

.slide-animation.ng-leave.ng-leave-active {
  opacity:0;
  left: 0;
  top: 0;
}

Все работает отлично, , за исключением полосы прокрутки, которая появляется при вводе содержимого. Он перемещается справа налево (как вы можете видеть в коде).

Я хочу скрыть полосу прокрутки во время анимации.

Что я делаю неправильно?

Ответ 1