提升缩放不适用于引导轮播中的图像

Question

如果我将elevatezoom直接用于任何图像，如下所示：它将起作用。

<div class="col-md-6">
    <img class="zImage img-fluid" src="http://localhost/project/public/uploads/images/i4.jpg" alt="">
</div>

$('.zImage ').elevateZoom(); 

但是，如果我尝试在Bootstrap轮播中实现相同的逻辑，则它不会起作用，也不会显示任何错误。

<div class="carousel-inner zoomImage">
  <div class="carousel-item active">
    <img class="d-block w-100 img-responsive" src="http://localhost/project/public/uploads/images/i4.jpg" alt="i4.jpg">
  </div>
  <div class="carousel-item ">
    <img class="d-block w-100 img-responsive" src="http://localhost/project/public/uploads/images/fff.png" alt="fff.png">
  </div>
  <div class="carousel-item ">
    <img class="d-block w-100 img-responsive" src="http://localhost/project/public/uploads/images/r4.jpg" alt="r4.jpg">
  </div>
</div>

$('.zoomImage .active img').elevateZoom(); 

// this also doesn't work:
$('img').elevateZoom(); 

我该如何解决？