Animate.css無法正常工作

所以，我試過使用animate.css，我終於找到了它的工作。但是一些動畫會導致我使用它的元素從原始位置移動，但不是所有。Animate.css無法正常工作

有人知道是什麼原因造成的嗎？

<!DOCTYPE html> 
<html> 
    <head> 
    <title>deadinside</title> 
    <link rel="stylesheet" href="css/style.css"> 
    <link rel="stylesheet" href="css/animate.css"> 
    <link rel="stylesheet" href="css/animate.min.css"> 
    </head> 

    <script src="js/ctrl.js"> </script> 

    <body oncontextmenu="return false" onkeypress="return disableCtrlKeyCombination(event);" onkeydown="return disableCtrlKeyCombination(event);" > 

    <video autoplay="true" loop="true"> 
     <source src="videos/antarctica.mp4" type="video/mp4"> 
     <source src="videos/di.webm" type="video/webm"> 
    </video> 

    <a href="http://steamcommunity.com/groups/deadinsiide" target="_blank"><img src="img/deadinsiderw.png" width="484" height="87" class="image animated fadeInUp"/></a> 

    <script src="js/f12.js"> </script> 

    </body> 
</html

。

body, html { 
    margin: 0; 
    padding: 0; 
} 

video { 
    position: fixed; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%, -50%); 
    min-width: 100%; 
    min-height: 100%; 
    width: auto; 
    height: auto; 
    z-index: 1; 
} 

} 

.text { 
    z-index: -1; 
    position: absolute; 
    background: rgba(0, 0, 0, 0); 
} 

a { 
    font-family: Helvetica, Arial; 
    font-size: 6em; 
    color: white; 
    text-align: 
} 

.image{ 
    position: fixed; 
    /*element can move on the screen (only screen, not page)*/ 

    left:50%;top:50%; 
    /*set the top left corner of the element on the center of the screen*/ 

    transform:translate(-50%,-50%); 
    /*reposition element center with screen center*/ 

    background: rgba(0, 0, 0, 0); 

    z-index:10000; 
    /*actually, this number is the count of the elements of page plus 1 :)*/ 
    /*if you need that holds the element top of the others. */ 
}

來源

2017-05-12 sebbejar

請示例代碼？ –

我已添加代碼 – sebbejar

我已經解決了。我將圖像集中在一起的方式就是問題所在。

來源

2017-05-13 16:44:16 sebbejar

Animate.css無法正常工作

回答

相關問題