Question

我正在使用一个光滑的滑块，该滑块包含3个带有背景图像的图形。第一张幻灯片可以正常工作，但随后的幻灯片都无法显示。检查人员显示，紧随第一个幻灯片后的每个幻灯片都将保持滑行所赋予的无效幻灯片位置，从而将其推离屏幕。当我仅使用String jsonString = "[ "{\"pack_id\":\"39\",\"pack_dsc\":\"350 Package\",\"pack_tax_amt\":\"0\",\"pack_grand_total\":\"419\"}","{\"pack_id\":\"2232\",\"pack_dsc\":\"Bangara(280)\",\"pack_tax_amt\":\"0\",\"pack_grand_total\":\"280\"}"]" String outputString = jsonString.replaceAll("\\\\", ""); Log.e("Clear String :", outputString);而不是<img />或<figure>时，它确实起作用。如果不是因为这些给我的尺寸问题，我会使用<div>。

我循环播放内容，以便可以轻松控制幻灯片的数量

<img />

这是当前的CSS

<div class="hero__background">
  <?php foreach ($images as $image) { ?>
     <div class="hero__background-image" style="background-image: url('<?php echo $image['url']; ?>');"></div>
  <?php } ?>
</div>

以及所要求的JS：）

&.hero {
  position: relative;
  height: 550px;

  .hero__background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: lightgray;
    z-index: -999;

    hero__background-image {
      background-size: cover;
    }

    .slick-list,
    .slick-track,
    .slick-slide {
      height: 100%;
      margin: 0;
    }
  }
}

背景图像失败的原因可能是什么？任何帮助和建议，将不胜感激。

光滑的滑块不更改活动滑块的位置

0 个答案: