Jquery syntax error while implementing zoom hover plugin

    $(document).ready(function(){
    $(function(){
        $('.my-gallery').imageZoom({
          $(this).imageZoom({
            zoom: 200
          });
        });
    });
});

HTML:
<link rel="stylesheet"href="{% static 'click-tap-image/dist/css/image-zoom.css' %}" />
<script src="{% static  'click-tap-image/dist/js/image-zoom.min.js' %}"></script>


      <div class="slider-for m-2" class="my-gallery">
        <img src="{% static 'images/product1.png' %}" width="80" class="gallery-image">
        <img src="{% static 'images/product2.png' %}" width="80" class="gallery-image">
        <img src="{% static 'images/product3.png' %}" width="80" class="gallery-image">
        <img src="{% static 'images/product4.png' %}" width="80" class="gallery-image">
        <img src="{% static 'images/product5.png' %}" width="80" class="gallery-image">
        <img src="{% static 'images/product3.png' %}" width="80" class="gallery-image">
      </div>

I linked the jquery click-image-Error in jszoom plugin. what is the wrong with this code.. it shows an error in vscode showing '{' expected can someone please, help?

The error is caused on the line $(this).imageZoom. However you should not need this line as you're already calling $('.my-gallery').imageZoom. Simply just pass in the Zoom parameters

For example:

$(function () {
    $('.my-gallery').imageZoom({
        zoom: 200
    });
});