52 lines
1.5 KiB
JavaScript
52 lines
1.5 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function() {
|
|
// Hole den Slider-Container
|
|
const heroSlider = document.querySelector('.hero-slider');
|
|
|
|
// Stelle sicher, dass der Slider auf der Seite existiert
|
|
if (!heroSlider) {
|
|
return;
|
|
}
|
|
|
|
// Konfiguration für den Slider vorbereiten
|
|
const swiperConfig = {
|
|
// Der Effekt ist jetzt fest auf "Überblenden" eingestellt
|
|
effect: 'fade',
|
|
fadeEffect: {
|
|
crossFade: true
|
|
},
|
|
|
|
// Loop-Einstellung ist jetzt DYNAMISCH
|
|
loop: sliderSettings.loop === '1',
|
|
|
|
// Autoplay
|
|
autoplay: {
|
|
delay: 5000,
|
|
disableOnInteraction: false,
|
|
},
|
|
|
|
pauseOnMouseEnter: true,
|
|
|
|
// Prüfe, ob die Pfeile NICHT ausgeblendet werden sollen
|
|
navigation: sliderSettings.hideArrows !== '1' ? {
|
|
nextEl: '.swiper-button-next',
|
|
prevEl: '.swiper-button-prev',
|
|
} : false,
|
|
|
|
// Prüfe, ob die Paginierung NICHT ausgeblendet werden soll
|
|
pagination: sliderSettings.hidePagination !== '1' ? {
|
|
el: '.swiper-pagination',
|
|
clickable: true,
|
|
} : false,
|
|
|
|
on: {
|
|
init: function () {
|
|
setTimeout(() => {
|
|
heroSlider.classList.add('swiper-initialized');
|
|
}, 50);
|
|
},
|
|
},
|
|
};
|
|
|
|
// Initialisiere den Slider mit der konfigurierten Optionen
|
|
new Swiper('.hero-slider', swiperConfig);
|
|
}); |