全屏旋转背景图像

我一直在寻找如何实现覆盖整个屏幕的动画旋转图像的这种效果。 Like this one。全屏旋转背景图像

低音，我想要的是让它旋转并成为全屏。

这是我走到这一步，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; 
}

，你可以看到，我可以把它旋转但不能全屏，是有可能吗？谢谢！

来源

2013-03-26 danii

你必须提高你的图像分辨率。 @ user2207103 – 2013-03-26 04:01:22

他们使用JavaScript而不是CSS来制作动画。使用变换，然后使用比例/旋转属性。 – ahren 2013-03-26 04:04:27

使用的方式width:100%;而非width:1000px;

和height:100%而非height:1000px;

清凉效果的尝试，我可能会找个借口使用技巧。

来源

2013-03-26 04:07:28 apaul

我试过了，但是在旋转时看到黑色的身体背景。 – danii 2013-03-26 04:13:55

你使用什么浏览器？ – apaul 2013-03-26 04:25:33

我在Chrome中看到你在说什么，100％在Firefox中工作。 – apaul 2013-03-26 04:28:03

全屏旋转背景图像

回答

相关问题