jQuery addClass example

Change class name on click in jQuery

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fotorama/4.6.4/fotorama.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fotorama/4.6.4/fotorama.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/fotorama/4.6.4/fotorama.png"></script>
<div class="gallery">
  <div class="fotorama" data-nav="thumbs" data-transition="crossfade"   data-thumbwidth="100" data-thumbheight="70" 
    data-arrows="true" data-click="true" data-swipe="true" data-allowfullscreen="true">
    <img src="https://picsum.photos/200/300">
    <img src="https://loremflickr.com/200/300">
  </div>
</div>

SCSS

.gallery {
  max-width: 650px;
}
.fotorama {
  max-width: 100%;
  display: block;
  padding-left: 100px;
}
/* .fotorama__loaded--img img{max-width:100%;} */
.fotorama__nav-wrap {
  transform: rotate(90deg);
  transform-origin: 0 0;
  position: absolute;
  top: 0;
  left: 0;
  .fotorama__nav {
    text-align: left;
  }
  .fotorama__img {
    transform: rotate(270deg);
  }
}