Animate.css的fadeInLeft＆amp; fadeInRight同时

Question

我想同时使用Animate.css的fadeInLeft和fadeInRight，但是当元素出现时，水平滚动变得比实际屏幕尺寸更大。

让我告诉你我的意思。

每个元素来自左侧和右侧，同时出现水平滚动。当元素到达彼此相邻时，水平滚动就会消失。

我使用的代码：

HTML

<div class="tc">
    <div class="fl w-50">
        <div class="animate fadeInLeft">
        <img src="https://i.imgbox.com/Ism1Ekjf.jpg">
        </div>
    </div>

    <div class="fl w-50">
        <div class="animate fadeInRight">
        <img src="https://i.imgbox.com/Ism1Ekjf.jpg">
        </div>
    </div>
</div>

CSS

.tc { text-align: center; }
.fl { float: left; _display: inline; }
.w-50 { width: 50%; }

和Animate.css库：https://github.com/daneden/animate.css/blob/master/animate.css

Answer 1

添加overflow-x：hidden;到你的身体CSS。

这不是一个理想的情况，但应该做到这一点！这基本上告诉浏览器忽略溢出x轴（水平）的任何东西。如果您想使用水平滚动条，则需要使用不同的解决方案。