图片在Chrome和Firefox中显示，但在Safari中不显示

Question

此代码字符串在其他浏览器中有效，但在野生动物园中不起作用。 我尝试了许多添加的javascript字符串，但似乎无济于事。该网站是www.wthn.com

请帮助。

谢谢

<div class="product-featured-images js-sticky"> 

    <img class="js-featured-image featured-image active" src="https://cdn.accentuate.io/1998318305337/5012029440057/Fully%20Charged%20(HP).jpg?1856x2193" data-section="how-to-use"> 

    <img class="js-featured-image featured-image" src="https://cdn.accentuate.io/1998318305337/5012025999417/Fully%20Charged%20(Compressed).png?683x1024" data-section="benefits"> 

    <img class="js-featured-image featured-image" src="https://cdn.accentuate.io/1998318305337/5012026032185/Fully%20Charged.jpg?1080x1080" data-section="ingredients"> 

</div>

图像上的主要css是：

.product-featured-images {
  height: 100vh;
  position: relative;
  z-index: -1; }

.product-featured-images.is-sticky {
  position: fixed;
  width: 50%;
  top: 0; }

.product-featured-images.is-stuck-bottom {
  position: absolute;
  width: 50%;
  bottom: 0; }

.featured-image {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  height: 100vh;
  opacity: 0;
  transition: opacity 0.5s ease-in-out;
  object-fit: cover; }

.featured-image.active {
  opacity: 1; }