我正在用三次贝塞尔曲线过渡对Angular中的ng视图进行动画处理：
/* 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;
}
一切正常，除了在输入内容时出现的滚动条。它从右侧移动到左侧（如您在代码中所见）。
我想在动画期间隐藏滚动条。
我究竟做错了什么？
您需要overflow:hidden在bodyCSS中进行设置。但是请注意，添加此选项将隐藏所有溢出的内容，包括垂直滚动条，并且您不希望这样做，因为如果高度溢出，页面内容将被隐藏。因此，如果您使用的是幻灯片过渡（向侧面），而只想隐藏过渡期间出现的水平滚动条，请改用此方法：
body {
overflow-x:hidden;
}
这样，您只隐藏了水平滚动条，而垂直滚动条仍然可以使用。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句