gistfile1.js

    var maxSlides = 7;
    
    var mySwiper = new Swiper('.swiper-container',{
      slidesPerView: maxSlides,
      slidesPerGroup: maxSlides,
      watchActiveIndex: false,
      initialSlide: 7,

      onSlideClick : function () {
        console.log(mySwiper.clickedSlideIndex);
      },

      onSlideChangeEnd : function () {
        if(mySwiper.activeIndex == 0) {
          mySwiper.prependSlide('<div class="title">test' + counter++ + '</div>'); 
          mySwiper.prependSlide('<div class="title">test' + counter++ + '</div>'); 
          mySwiper.prependSlide('<div class="title">test' + counter++ + '</div>'); 
          mySwiper.prependSlide('<div class="title">test' + counter++ + '</div>'); 
          mySwiper.prependSlide('<div class="title">test' + counter++ + '</div>'); 
          mySwiper.prependSlide('<div class="title">test' + counter++ + '</div>'); 
          mySwiper.prependSlide('<div class="title">test' + counter++ + '</div>'); 
          mySwiper.swipeTo(7,0);
        }

        else if (mySwiper.activeIndex == mySwiper.slides.length - maxSlides) {
          mySwiper.appendSlide('<div class="title">test</div>'); 
          mySwiper.appendSlide('<div class="title">test</div>');  
          mySwiper.appendSlide('<div class="title">test</div>');  
          mySwiper.appendSlide('<div class="title">test</div>');  
          mySwiper.appendSlide('<div class="title">test</div>');  
          mySwiper.appendSlide('<div class="title">test</div>');  
          mySwiper.appendSlide('<div class="title">test</div>'); 
        }
      }   
    });