swiper能否在最一开始加载的第一张加上过渡时间？

Question

分页器用的svg写的动画 轮播autoplay4000 speed1000 如果动画时间设置4s最一开始第一张动画能够完成之后再切换下一张 再之后的动画就会相比提前1s完成 如果动画是5S最一开始第一张动画就会没完成就切换了 再之后的就是正确时间切换

// var mySwiper = new Swiper ('.swiper-container', {

  effect : 'fade',  
  loop:true,
  paginationClickable: true,  //  分页器可点击跳转
  autoplay: 4000, 
  speed:  800,
  pagination: '.swiper-pagination',
  autoplayDisableOnInteraction : false, //用户操作后不允许停止轮播
  paginationType: 'custom',//这里分页器类型必须设置为custom,即采用用户自定义配置
  //下面方法可以生成我们自定义的分页器到页面上 current当前页的num
  paginationCustomRender: function(swiper, current, total) {
    var customPaginationHtml = "";
    for(var i = 0; i < total; i++) {
      //判断哪个分页器此刻应该被激活
      if(i == (current - 1)){
        customPaginationHtml += '<span class="banner-active swiper-pagination-customs-active"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><path d="M 8 1 a 7 7 0 0 1 0 14 a 7 7 0 0 1 0 -14 Z" fill="none" stroke="#807c7c" stroke-width="2" stroke-linecap="round" stroke-dasharray="43.98847961425781"><animate attributeName="stroke-dashoffset" dur="4s" from="43.98847961425781" to="0" repeatCount="forwards" /></path></svg></span>';
      } 
      else {
        customPaginationHtml += '<span class="swiper-pagination-customs"></span>';
      }
    }
    return customPaginationHtml;
  },

Answer 1

你如果想继续用这个达到效果的话多看看https://www.swiper.com.cn/这...

Answer 2

延迟，换个思路，迟一点初始化