javascript - Animate.css 按钮位置错误

Question

如果我尝试使用 Animate.css 制作动画，按钮的定位就会出现问题。
通常，它位于页脚，但在淡入淡出期间，它位于中心: https://jsfiddle.net/m4f1wen3/

我有 1 周的时间都想不出解决方案。

<div id="player">
 <header>
  ...
 </header>

 <main>
  ...
 </main>

 <footer>
  <button>Lass uns loslegen!</button>
 </footer>
</div>

我的目标是它在过渡到底部的过程中像动画之后一样粘住。

Answer 1

动画 fadeInLeft 为您的 div 添加了一个翻译属性，并改变了具有绝对定位的页脚的定位。

将此添加到您的样式表中，它将起作用:

html, body, #index, #player {
  height: 100%;
}

这将使 html、正文和您的 div 填充页面高度，并且页脚的底部定位将保持不变。