我想做一个
CSS3变换：rotate(360deg);在过渡1s;
在背景图像而不是单独的图像(元素)..
这可能吗？我已经搜索了谷歌,但没有成功！
我想要实现的是：
在背景图像而不是单独的图像(元素)..
这可能吗？我已经搜索了谷歌,但没有成功！
我想要实现的是：
#footerlogo { background: url('ster.png'),-moz-transition: -moz-transform 1s,transition: transform 1s,-o-transition: -o-transform 1s,-webkit-transition: -webkit-transform 1s; background-position: #outlinedtotheleft; } #footerlogo:hover { background: transform: rotate(360deg); -o-transform: rotate(360deg); -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); }
我希望这是可能的！我知道JS(jQuery)很容易实现：
$('#something').hover(function(){morecodehere});
…但我想知道是否有可能只有CSS(3)
HTML：
<div id="footerlogo"> <img src="carenza.png"/> </div>
解决方法
当然可以,尝试这样的事情：
HTML
<div id="planet"> </div>
CSS
#planet {
width:200px;
height:200px;
background: transparent url(http://cdn3.iconfinder.com/data/icons/nx11/Internet%20-%20Real.png) no-repeat center center;
}
#planet {
-webkit-animation-name: rotate;
-webkit-animation-duration:2s;
-webkit-animation-iteration-count:infinite;
-webkit-animation-timing-function:linear;
-moz-animation-name: rotate;
-moz-animation-duration:2s;
-moz-animation-iteration-count:infinite;
-moz-animation-timing-function:linear;
}
@-webkit-keyframes rotate {
from {-webkit-transform:rotate(0deg);}
to { -webkit-transform:rotate(360deg);}
}
@-moz-keyframes rotate {
from {-moz-transform:rotate(0deg);}
to { -moz-transform:rotate(360deg);}
}
