imasters Rodar Botão

Rodar btn 180 graus depois de um click

by Tiago Sousa

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
<a href="#" id="my_btn" class="btn btn-primary">
  <i class="fa fa-sort-desc" aria-hidden="true"></i>
</a>

CSS

.up {
  -ms-transform: rotate(180deg);
  /* IE 9 */
  -webkit-transform: rotate(180deg);
  /* Chrome, Safari, Opera */
  transform: rotate(180deg);
}

JavaScript

$('#my_btn').on('click', function(e) {
  e.preventDefault();
  $(this).toggleClass('up');
})