如何通过两次点击在两个方向上旋转图标？

Question

我想在第一次点击时旋转90度时钟方向，在第二次点击时逆时针旋转90度。 （请记住，图标可以使用<i>标记或<span>标记）

加载

Answer 1

试试这个

.rotation_90deg{
   -moz-transition: all 2s linear;
   -webkit-transition: all 2s linear;
   transition: all 2s linear;
}

.rotation_90deg.down{
  -moz-transform:rotate(90deg);
  -webkit-transform:rotate(90deg);
   transform:rotate(90deg);
}

添加到下面的css类

$(".rotation_90deg").click(function(){
  $(this).toggleClass("down")  ; 
});

在你的剧本中

.second_el

工作小提琴http://jsfiddle.net/zakirshakir/3v2egwfs/790/