javascript - 面板关闭时动画返回

Question

我的面板右侧有一些箭头。所以当我点击它们时，它们就会旋转。

$('.arrow').click(function() {
    $(this).css('transform', 'rotate(90deg)');
});

如果面板已关闭，我现在想将它们旋转回起点。

我的代码不是很先进，但这是我到目前为止所拥有的:https://jsfiddle.net/xvrccycm/

Answer 1

您不必为此使用 JavaScript。您可以根据 collapsed 类更改变换。

.panel-heading .arrow {
  transform: rotate(90deg);
}
.panel-heading .collapsed .arrow {
  transform: rotate(0);
}

JSFIDDLE