https://www.spa-alpenrose.at/bundles/customelements/frontend/js/ce_start_image.js?v=1ec5cb05

1document.addEventListener("DOMContentLoaded", () => {
2    console.info('start image slider is waiting');
3
4    const startImageSlider = document.querySelectorAll("#start-image.slider-container");
5
6    if(startImageSlider.length) {
7        $(startImageSlider).slick({
8            autoplay: true,
9            autoplaySpeed: 3000,
10            slidesToShow: 1,
11            touchMove: false,
12            swipe: false,
13            pauseOnHover: false,
14            arrows: true,
15            mobileFirst: true,
16            infinite: true,
17            speed: 1000,
18            fade: true,
19            cssEase: 'linear',
20            responsive: [],
21        })
22        .on('afterChange', function(event, slick, currentSlide){
23
24        });
25    }
26
27// header sticky handling
28    const startImageTarget = document.getElementById("start-image"),
29        headerElement = document.getElementById("header");
30
31    if(headerElement !== null) {
32        // configure options
33        const startImageOptions = {
34            root: null,        // The viewport is the root element
35            rootMargin: '15px', // additional margin around the root
36            threshold: 0     // How much must be visible of the element to start the animation (0 - 1)
37        };
38
39        // Define startImageCallback function
40        const startImageCallback = (entries, startImageObserver) => {
41            entries.forEach(entry => {
42                if (entry.isIntersecting) {
43                    if(!headerElement.classList.contains('index')) {
44                        headerElement.classList.add("transparent");
45                    } else {
46                        headerElement.classList.remove("fixed");
47                    }
48                } else {
49                    headerElement.classList.add("fixed");
50                    if(!headerElement.classList.contains('index')) {
51                        headerElement.classList.remove("transparent");
52                    }
53                }
54            });
55        };
56
57        // create Intersection Observer
58        const startImageObserver = new IntersectionObserver(startImageCallback, startImageOptions);
59
60        // Start monitoring the target element
61        startImageObserver.observe(startImageTarget);
62    }
63});