全屏旋轉背景圖像

Question

我一直在到處尋找如何實現覆蓋整個屏幕的動畫旋轉圖像的效果。 喜歡這個 。

令人費解的是，我想要使它旋轉並全屏顯示。

這是我到目前為止所獲得的， http://losmosca.com.ar/reiki/

HTML：

<img src="img/bg.jpg" id='test' class='rotating'>

CSS3：

#test {
position:relative;
margin:0 auto;
width:1000px;
height:1000px;
}

@-webkit-keyframes rotating {
     from{
        -webkit-transform: rotate(0deg);
     }
     to{
        -webkit-transform: rotate(360deg);
     }
}

.rotating {
    -webkit-animation: rotating 1000s linear infinite;
}

如您所見，我可以使其旋轉但不能全屏顯示，這可能嗎？ 謝謝！

Answer 1

嘗試使用width:100%; 而不是width:1000px;

和height:100%而不是height:1000px;

順便說一句，效果很酷，我可能不得不找借口使用該技巧。