如何仅显示几个分页自定义bulletRender

时间:2019-05-16 14:54:13

标签: javascript html

当滑动子弹头过多时,它会溢出。我只想在DOM中缓存几张幻灯片,但仍然为每个子弹头保留漂亮的自定义名称。

这是用于网站上的时间轴滑动。

https://codepen.io/Barnicles/pen/OYbdQq

var timelineSwiper = new Swiper ('.timeline .swiper-container', {
  direction: 'vertical',
  loop: false,
  speed: 1600,
  pagination: '.swiper-pagination',
  paginationBulletRender: function (swiper, index, className) {
    var year = document.querySelectorAll('.swiper-slide')[index].getAttribute('data-year');
    return '<span class="' + className + '">' + year + '</span>';
  },
  paginationClickable: true,
  nextButton: '.swiper-button-next',
  prevButton: '.swiper-button-prev',
  breakpoints: {
    768: {
      direction: 'horizontal',
    }
  }

});

我希望paginationBulletRender继续包含跨度类并填满整个屏幕,但我只希望在屏幕上有几个。

0 个答案:

没有答案