Carousel
.modul-carousel
data-slidesperviewdesk
(default: 4)
data-slidesperviewtablet
(default: 2.2)
data-slidesperviewpalm
(default: 1.2)
data-loop
(default: false)
<div class="modul-carousel">
<div class="swiper-container swiper" data-slidesperviewdesk="4" data-loop="false">
<div class="swiper-controls">
<div class="swiper-button-prev" title="Weiterblättern"></div>
<div class="swiper-button-next" title="Zurückblättern"></div>
<div class="swiper-pagination" aria-hidden="true"></div>
</div>
<ul class="swiper-wrapper">
<li class="swiper-slide">
<!-- Slide 0 content START-->
<div class="image__image">
<img src="../../dummy/placeholder_4x3.jpg" alt="Alternative Bildbeschreibung" >
</div>
<!-- Slide 0 content END-->
</li>
<li class="swiper-slide">
<!-- Slide 1 content START-->
<div class="image__image">
<img src="../../dummy/placeholder_4x3.jpg" alt="Alternative Bildbeschreibung" >
</div>
<!-- Slide 1 content END-->
</li>
<li class="swiper-slide">
<!-- Slide 2 content START-->
<div class="image__image">
<img src="../../dummy/placeholder_4x3.jpg" alt="Alternative Bildbeschreibung" >
</div>
<!-- Slide 2 content END-->
</li>
<li class="swiper-slide">
<!-- Slide 3 content START-->
<div class="image__image">
<img src="../../dummy/placeholder_4x3.jpg" alt="Alternative Bildbeschreibung" >
</div>
<!-- Slide 3 content END-->
</li>
<li class="swiper-slide">
<!-- Slide 4 content START-->
<div class="image__image">
<img src="../../dummy/placeholder_4x3.jpg" alt="Alternative Bildbeschreibung" >
</div>
<!-- Slide 4 content END-->
</li>
<li class="swiper-slide">
<!-- Slide 5 content START-->
<div class="image__image">
<img src="../../dummy/placeholder_4x3.jpg" alt="Alternative Bildbeschreibung" >
</div>
<!-- Slide 5 content END-->
</li>
</ul>
</div>
</div>
data-loop="true"