js如何实现图片点击旋转

实现思路,主要利用css3的transform 实现

实现代码如下：

<style>
  .rotate90{
    transform:rotate(90deg);
    }
  .rotate180{
    transform:rotate(180deg);
    }
  .rotate270{
    transform:rotate(270deg);
    }
  .rotate360{
    transform:rotate(360deg);
    }
</style>
<script>
  var i = 0;
  var classes = ['rotate90', 'rotate180', 'rotate270', 'rotate360'];
  $('#imgClick').on('click',function(){
    var $this = $(this);
    $this.addClass(classes[i % 4]).removeClass(function(idx, cls) {
              var classes = cls.split(' ');
              return classes.length > 1 ? classes[0] : '';
            });
    i++;
  });
</script>

喜欢的朋友欢迎点赞收藏哦！