jQuery addClass example

Change class name on click in jQuery

by rahulr

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/2.7.0/fabric.js"></script>

  <!--Ajax Loader End-->
  <div class="col-md-6">
  <button type="button" id="selectBtn">
  Select groups
  </button>
  <div class="col-md-12" id="canvas-container" style="height: 100%; border: 1px solid red">
    <canvas id="canvas" class="canvas" style="height: 100%; width: 100%"></canvas>
  </div>

JavaScript

$(function () {
const SCALE_FACTOR = 100;
const hdImgUrl = "http://szcdn1.raagalahari.com/april2019/hd/payal-rajput-stripped-suit-trousers-shoot/payal-rajput-stripped-suit-trousers-shoot";
const thumbnailUrl = "http://szcdn.raagalahari.com/april2019/hd/payal-rajput-stripped-suit-trousers-shoot/payal-rajput-stripped-suit-trousers-shoot";
var canvas = new fabric.Canvas('canvas');
    fabric.Object.prototype.objectCaching = false;
    fabric.Object.prototype.statefullCache = false;
    fabric.Object.prototype.noScaleCache = true;
    fabric.Object.prototype.needsItsOwnCache = false;
    $('.ajax-loader').css("visibility", "visible");
    canvas.setDimensions({ width: 600, height: 500 });
var imgArray = ["http://szcdn.raagalahari.com/april2019/hd/payal-rajput-stripped-suit-trousers-shoot/payal-rajput-stripped-suit-trousers-shoot1t.jpg",
        "http://szcdn.raagalahari.com/april2019/hd/payal-rajput-stripped-suit-trousers-shoot/payal-rajput-stripped-suit-trousers-shoot2t.jpg",
        "http://szcdn.raagalahari.com/april2019/hd/payal-rajput-stripped-suit-trousers-shoot/payal-rajput-stripped-suit-trousers-shoot3t.jpg",
        "http://szcdn.raagalahari.com/april2019/hd/payal-rajput-stripped-suit-trousers-shoot/payal-rajput-stripped-suit-trousers-shoot4t.jpg",
        "http://szcdn.raagalahari.com/april2019/hd/payal-rajput-stripped-suit-trousers-shoot/payal-rajput-stripped-suit-trousers-shoot5t.jpg",
        "http://szcdn.raagalahari.com/april2019/hd/payal-rajput-stripped-suit-trousers-shoot/payal-rajput-stripped-suit-trousers-shoot6t.jpg",
        "http://szcdn.raagalahari.com/april2019/hd/payal-rajput-stripped-suit-trousers-shoot/payal-rajput-stripped-suit-trousers-shoot7t.jpg",
        "http://szcdn.raagalahari.com/april2019/hd/payal-rajput-stripped-suit-trousers-shoot/payal-rajput-stripped-suit-trousers-shoot8t.jpg",
        "http://szcdn.raagalahari.com/april2019/hd/payal-rajput-stripped-suit-trousers-shoot/payal-rajput-stripped-suit-trousers-shoot9t.jpg",
       ...