jQuery toggleClass example

Toggle class name on click in jQuery

by l2banners

HTML

<div class="wrapper">
<div class="block"></div>
</div>

<div class="prev">BACK</div>
<div class="next">NEXT</div>

CSS

.wrapper{
  display:flex;
  justify-content: center;
}
.block{
  width: 200px;
  height: 300px;
  background: green;
}
.prev, .next{
  border: 1px solid;
  width: 50px;
  padding: 20px;
}

JavaScript

let offset = 0;
$('.prev').click(function() {
if(offset == -80) return;
 offset -= 20;
 $('.block').animate({'margin-left': offset + '%'}, 'slow');
});


$('.next').click(function() {
if(offset == 80) return;
 offset += 20;
 $('.block').animate({'margin-left': offset + '%'}, 'slow');
});