我有一个带有应用动画风格的位图，可以将其旋转到nausaum。我希望它向左移动并在触发事件时调整大约50％（在这种情况下悬停）。我已经能够顺利地向左移动，但我没有得到transform：scale命令的响应。 See jsfiddle here
.wheel:hover {
margin-left: -228px;
transform: scale(0.5);
}
我做错了什么？
答案 0 :(得分：0)
它不起作用，因为动画中的图像上有transform:rotate()。并在同一图像上添加另一个transform，在动画工作的同时，这是不可能的
而不是transform:scale(0.5)您可以使用height:50%;width:auto。看下面的片段或小提琴＆gt;的 jsFiddle
让我知道是否有帮助
@keyframes spin {
from {transform:rotate(0deg);}
to {transform:rotate(360deg);}
}
.wheel {
position: fixed;
top: 30px;
left: 140px;
animation: spin 15s infinite linear;
transition: all 0.5s linear;
}
.wheel:hover {
margin-left: -228px;
width:auto;
height:50%;
}<body>
<img src="https://pbs.twimg.com/profile_images/616542814319415296/McCTpH_E.jpg" class="wheel">
</body>