时间戳

首页 > 解决方案 > framework7 V1中的滑动滑块在第一张和最后一张图像之后和之前创建空白页

cordova - framework7 V1中的滑动滑块在第一张和最后一张图像之后和之前创建空白页

问题描述

当我在我的科尔多瓦应用程序中使用框架 7 中的滑动滑块时，它具有静态图像。滑块工作完美，但是当我从 Web 服务动态获取图像时，它会在第一张图像之前和最后一张图像之后创建空白页，滑块不会停止，这是我的示例代码

当图像是静态的：----

<div data-space-between="50" class="swiper-container swiper-init" >
     <div class="swiper-pagination"></div>
    <div class="swiper-wrapper" id="plot_img">

      <div class="swiper-slide" ><img src="images/slider1.jpg" alt="">
        <div class="slide_text">
          <h4>some head1</h4>
          <p>sometext1</p>
        </div>
      </div>
      <div class="swiper-slide"><img src="images/slider1.jpg" alt="">
          <div class="slide_text">
            <h4>some head2</h4>
            <p>some text2</p>
          </div>
      </div>
  </div>
</div>

当我在这里动态获取图像时是 html，我试图在 id="plot_img" 中绘制图像

<div data-space-between="50" class="swiper-container swiper-init" >
     <div class="swiper-pagination"></div>
    <div class="swiper-wrapper" id="plot_img">
     </div>
</div>

这是ajax代码

json.response.forEach(function(obj,val){
      imghtml += '<div class="swiper-slide"><img 
    src="'+json.url_to_append+''+obj.fields.featured_image+'" alt="">
    <div 
    class="slide_text"><h4>'+obj.fields.banner_name+'</h4>
    <p>'+obj.fields.banner_description+'</p></div></div>';
});

$$('#plot_img').html(imghtml)

标签： cordovahtml-framework-7

解决方案

推荐阅读