僅運行在頁面加載動畫，當容器再次

Question

<div> 
    <p class="bounceIn"> 
    Hello world 
    </p> 
</div> 

https://jsfiddle.net/2fr1tcv6/

顯示出來的頁面加載後不能運行，這些元素是可見的，所以bounceIn動畫運行。

但是在頁面上，用戶可以點擊一個按鈕並隱藏div，然後重新顯示它。當div再次顯示時，我不想讓動畫運行。有沒有辦法用CSS屬性來實現？

Answer 1

您可以從P標記中刪除bounceIn類。事情是這樣的：

$("button").click(
    function(){ 
    $("div").toggle(); 
    $("p").removeClass("bounceIn"); 
    });