Как добавить слайд?

Question

[Yura_Mart]

В slick.js добавлял так:

const div = $(' html код.........');
$(".slider_here").slick('slickAdd', div);

А как такое же сделать с swiper api?

$(".slider_here").append(div); - выводит всё сразу друг на друге.

Вот html для swiper с выводом одного слайда:

<div class="homepage-slider no-bottom">
     <div class="swiper-wrapper slider_here">

          <div class="swiper-slide">
             <a href="news-post.html">
               <img class="responsive-image" src="images/pictures/banner3.jpg" alt="img">
             </a>
            <div class="overlay"></div>
          </div>

     </div>
</div>

Answer 1

[Денис Богданов]

Документация на этот плагин говорит, что нужно использовать метод appendSlide

new Swiper('.swiper-container', {
    speed: 400,
    spaceBetween: 100
});

var mySwiper = document.querySelector('.swiper-container').swiper

mySwiper.appendSlide('<div class="swiper-slide">Slide 10"</div>')
mySwiper.appendSlide([
   '<div class="swiper-slide">Slide 10"</div>',
   '<div class="swiper-slide">Slide 11"</div>'
]);

Comments

[Yura_Mart]

да, для этого сначала нужно инициализировать слайдер:
var mySwiper = new Swiper('.swiper-container', {
speed: 400,
spaceBetween: 100
}); - так например, но почему то не хочет нормально выводить

[Денис Богданов]

Да, после инициализации, для доступа к методам нужно сделать по другому. Поправил пример

[Yura_Mart]

всё, спасибо, заработало, я тупанул в html разметке, кое - что лишнее лепил)