1

尝试使用 css 旋转图像,但由于某种原因hover仅适用于 firefox。图像在所有浏览器中旋转,但hover旋转在 IE 和 chrome 中不起作用

.button img {
        position:absolute;
        left:500px;
        top:300px;
        width:70px;
        height:70px;
        -webkit-animation: rotation 4s infinite linear;
        -moz-animation: rotation 4s infinite linear;
        animation: rotation 4s infinite linear;
    }

    .button img:hover{
        -webkit-animation: rotation 2s infinite linear;
        -moz-animation: rotation 2s infinite linear;
        animation: rotation 2s infinite linear;
    }


    @-moz-keyframes rotation { 100% { -moz-transform: rotate(360deg); } }
    @-webkit-keyframes rotation { 100% { -webkit-transform: rotate(360deg); } }
    @keyframes rotation { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
4

1 回答 1

1

我还不知道为什么部分(寻找它),但我观察到它在 chrome.button:hover.button img:hover工作得很好。

我在这里设置了一个小提琴(其余代码相同),它适用于 chrome。

于 2013-09-21T02:49:00.027 回答