Animate.css的fadeInLeft＆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轴（水平）的东西。如果你想使用水平滚动条，你需要一个不同的解决方案。