Wow.js - 在固定高度的滾動div中的動畫。一些對象消失

我正在使用wow.js淡入一些在溢出自動和固定高度的div下的div。Wow.js - 在固定高度的滾動div中的動畫。一些對象消失

一些物體動畫很好，但其中一些物體不會動畫或甚至出現（保持不可見）。

我認爲這是一個視口問題。未出現在視口內的對象永遠不可見。

這裏是我的代碼：

<html> 
<head> 
<style> 
.box{ 
    width:300px; 
    margin:0 auto; 
    height:500px; 
    overflow:auto; 
} 
.smallBoxes{ 
    position:relative; 
    width:200px; 
    height:200px; 
    color:#fff; 
    background-color:#339; 
    text-align:center; 
    vertical-align:middle; 
    margin:10px; 
} 

</style> 

<script type='text/javascript' src="js/jquery-1.12.4.js"></script> 
    <script type='text/javascript' src="js/wow.min.js"></script> 
    <script type='text/javascript' src="js/wow.js"></script> 


    <script> 
new WOW().init(); 
</script> 
</head> 

<body> 
<div class="box"> 
    <div class="smallBoxes wow fadeIn" data-wow-delay="0.0s">Box1</div> 
    <div class="smallBoxes wow fadeIn" data-wow-delay="0.1s">Box2</div> 
    <div class="smallBoxes wow fadeIn" data-wow-delay="0.2s">Box3</div> 
    <div class="smallBoxes wow fadeIn" data-wow-delay="0.3s">Box4</div> 
    <div class="smallBoxes wow fadeIn" data-wow-delay="0.4s">Box5</div> 
    <div class="smallBoxes wow fadeIn" data-wow-delay="0.5s">Box6</div> 
    <div class="smallBoxes wow fadeIn" data-wow-delay="0.6s">Box7</div> 
    <div class="smallBoxes wow fadeIn" data-wow-delay="0.7s">Box8</div> 
    <div class="smallBoxes wow fadeIn" data-wow-delay="0.8s">Box9</div> 
    <div class="smallBoxes wow fadeIn" data-wow-delay="0.9s">Box10</div> 
</div> 
</body> 
</html>

謝謝

來源

2016-09-07 Steven

我已經找到了解決辦法。只是將代碼添加到我的風格。

.wow { 
    visibility: visible !important; 
}

來源

2016-09-07 07:05:15 Steven

Wow.js - 在固定高度的滾動div中的動畫。一些對象消失

回答

相關問題