div幻灯片使用css动画更改为另一个div

Question

我在容器（也是div）中有两个div（page1 + page2） 容器有溢出：隐藏属性，但是当动画启动时，忽略溢出配置。 此外，当上页移动时应该显示的页面不会出现。

https://jsfiddle.net/ok0hpw3s/

<div class="container">
            <div class="page1 animation">11111fwefew</div>
            <div class="page2 animation">2222fewefw</div>
</div>

Answer 1

要强制容器隐藏溢出，您也需要将其置于绝对位置。

你没有看到下面页面的原因是因为两个内部div都被赋予了动画类，所以两者都做了完全相同的事情。我不确定你想要的结果是什么，但这里是第2页动画的一个例子，将第1页留在下面，通过删除第1页的动画类来实现：https://jsfiddle.net/n40yd901/

<div class="container">
    <div class="page1">11111fwefew</div>
    <div class="page2 animation">2222fewefw</div>
</div>