title: jQuery zoom function not working on hover image
body: <p>I am using this library: <a href="https://www.jacklmoore.com/zoom/" rel="nofollow noreferrer">https://www.jacklmoore.com/zoom/</a><br>
  It adds a zoom function when hovering over an image. I did add the library in my theme and added this jQuery code to my js file:</p>
  
  <pre><code>$(document).ready(function(){
      $('.head-image img').zoom();
  });
  </code></pre>
  
  <p>This is the HTML where the image is located:</p>
  
  <pre><code>&lt;div class="head-image"&gt;
      &lt;img src="&lt;?php the_post_thumbnail_url('full'); ?&gt;" class="img-fluid"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>When I hover the image on the webpage nothing changes but if I look in the inspector I do see that the zoomImg class is added and the CSS is changing but I dont see the image zooming.</p>
  
  <p>Here is the webpage URL: <a href="https://www.dev.ruitershopboxmeer.nl/paard/zadels-en-toebehoren/zadeldekjes/kingsland-zadeldekje-carin/" rel="nofollow noreferrer">https://www.dev.ruitershopboxmeer.nl/paard/zadels-en-toebehoren/zadeldekjes/kingsland-zadeldekje-carin/</a></p>
  
  <p>Does someone know why the image is not zooming?</p>
  
  <p>Thanks for your time!</p>