(!slides.length) return; const isMobile = window.innerWidth <= BREAKPOINT; /* ========================= MOBILE ========================= */ if (isMobile) { if (wrapper.dataset.sliderInitialized === 'true') { return; } wrapper.dataset.sliderInitialized = 'true'; wrapper.classList.add('custom-blog-slider'); let currentIndex = 0; slider.style.display = 'flex'; slider.style.flexWrap = 'nowrap'; slider.style.overflow = 'hidden'; slider.style.transition = 'transform 0.4s ease'; slides.forEach(function (slide) { slide.style.flex = '0 0 100%'; slide.style.width = '100%'; slide.style.maxWidth = '100%'; slide.style.margin = '0'; }); /* Remove existing arrows if any */ wrapper.querySelectorAll('.custom-blog-slider-prev, .custom-blog-slider-next').forEach(function (btn) { btn.remove(); }); /* Previous Button */ const prevButton = document.createElement('button'); prevButton.type = 'button'; prevButton.className = 'custom-blog-slider-prev'; prevButton.setAttribute('aria-label', 'Previous blog post'); prevButton.innerHTML = '❮'; /* Next Button */ const nextButton = document.createElement('button'); nextButton.type = 'button'; nextButton.className = 'custom-blog-slider-next'; nextButton.setAttribute('aria-label', 'Next blog post'); nextButton.innerHTML = '❯'; wrapper.appendChild(prevButton); wrapper.appendChild(nextButton); function updateSlider() { slider.style.transform = 'translateX(-' + (currentIndex * 100) + '%)'; prevButton.disabled = currentIndex === 0; nextButton.disabled = currentIndex === slides.length - 1; } prevButton.addEventListener('click', function () { if (currentIndex > 0) { currentIndex--; updateSlider(); } }); nextButton.addEventListener('click', function () { if (currentIndex < slides.length - 1) { currentIndex++; updateSlider(); } }); updateSlider(); } /* ========================= DESKTOP ========================= */ else { if (wrapper.dataset.sliderInitialized !== 'true') { return; } wrapper.dataset.sliderInitialized = 'false'; wrapper.classList.remove('custom-blog-slider'); slider.style.display = ''; slider.style.flexWrap = ''; slider.style.overflow = ''; slider.style.transform = ''; slider.style.transition = ''; slides.forEach(function (slide) { slide.style.flex = ''; slide.style.width = ''; slide.style.maxWidth = ''; slide.style.margin = ''; }); wrapper.querySelectorAll( '.custom-blog-slider-prev, .custom-blog-slider-next' ).forEach(function (btn) { btn.remove(); }); } }); } initBlogSlider(); let resizeTimer; window.addEventListener('resize', function () { clearTimeout(resizeTimer); resizeTimer = setTimeout(function () { initBlogSlider(); }, 150); }); }); DSGVO Cookie Consent mit Real Cookie Banner