Question

我正在旋转这个div的文本，并想知道如果部分旋转并且鼠标从div移开后如何/是否可以慢慢解除旋转。

我无法将鼠标移动到目标上，因为它不确定将哪个div移动到。

示例如下。

.reblogbutton{
position:relative;
display:table;
color:black;
width:60px;
height:60px;
border-radius:32px;
border: solid 2.5px black;
text-align:center;
margin:auto;
top:2.5px;
background-color:#B19CD9;


}

.reblogbutton a{
display:table-cell;
color:black;
vertical-align:middle;
}

.reblogbutton a:hover{
transform:rotate(360deg);
-o-transform:rotate(360deg);
-moz-transform:rotate(360deg);
-webbkit-transform:rotate(360deg);
    transition: all 1.2s ease;
    -webkit-transition: all 1.2s ease;
    -moz-transition: all 1.2s ease;
    -o-transition: all 1.2s ease;
}

Answer 1

你是想恢复反时钟吗？如果是这样，您需要将指定的效果指定为默认状态。我正在使用类似于动画我的徽标的东西。 CSS就像这样：

#logo {
    width: 3.000em;
    height: 3.000em;
    float: right;
    transition: transform 0.5s;
    transform: rotate(-360deg);
}

#logo:hover {
    transition: transform 0.5s;
    transform: rotate(360deg);
}

结果发布在我的网站phclaus.eu.org（对不起自我宣传）

Answer 2

这样的事情？

http://jsfiddle.net/u197ymv9/

.reblogbutton a{
  display:table-cell;
  color:black;
  vertical-align:middle;
  transform:rotate(0deg);
  transition: all 1.2s ease;
}

如何＆＃34; unrotate＆＃34;部分轮换后的div？

2 个答案: