Transition扩展了页面

Question

我有关于CSS3过渡的问题。正如下面我的CSS文件片段所示，无论何时切换为活动状态，我都会向上滑动（我使用jQuery执行此操作）。

每当它变为活动状态时，它会向上推送网站内容，直到完成转换，此时内容会向下滑动。它看起来像页面扩展，但由于position属性，这不应该发生。为什么会这样？

提前感谢您的帮助。

.footer {
  height: 130px;
  width: 100%;
  position: absolute;
  bottom: -130px;
  background-color: #333;
  transition: bottom 250ms ease-out;
}
.footer-active {
  bottom: 0;
}

Answer 1

我找到了问题的解决方案。只要元素移动，窗口就会自动滚动到元素的位置。我通过将overflow: hidden插入到html和body的CSS规则中来解决问题。