jQuery toggleClass缓动不影响CSS转换属性

Question

我想......

1. 单击元素（.switch）
2. 在另一个元素（.div）上切换类
3. 切换类（.transformy）逐渐应用CSS变换。

我已经能够成功地使用其他CSS类，例如background-color，但不能转换。

正如您所看到的，转换适用，但不是逐渐适用。

https://jsfiddle.net/ds06sehq/3/

$( ".switch" ).click(function() {
$( ".div" ).toggleClass("transformy", 1000, "easeInOutQuad" );
});

如何逐步实现切换类的transform属性？当然愿意尝试非js / jq选项。

Answer 1

只需将此添加到您的div

即可

div {
  ..
  transition: all 1s;
  transform: rotate(0deg);
}

updated JSFiddle