Changing Carousel

static/js/carousel.js

@@ -0,0 +1,11 @@
+function moveCarousel() {
+    const carouselSlider = document.querySelector('.carousel-slider');
+    const carouselList = document.querySelector('.carousel-list');
+    const carouselItems = document.querySelectorAll('.carousel-item');
+    
+    const firstItem = carouselItems[0];
+    carouselList.removeChild(firstItem);
+    carouselList.appendChild(firstItem);
+}
+
+setInterval(moveCarousel, 3000);

static/js/index.js

@@ -0,0 +1,49 @@
+       document.addEventListener('DOMContentLoaded', function() {
+        const sideToggle = document.querySelector('.side-toggle');
+        const sideMenu = document.querySelector('.side-menu');
+        const sideCloseButtons = document.querySelectorAll('.side-close');
+        const content = document.querySelector('.content');
+        const headermove = document.getElementById('header');
+        const body = document.body;
+        const footermove = document.getElementById('footer');
+
+        sideToggle.addEventListener('click', function() {
+            sideMenu.classList.toggle('active');
+            this.classList.toggle('menu-opened');
+            content.classList.toggle('content-open');
+            headermove.classList.toggle('header-move');
+            body.classList.toggle('block-scroll');
+            footermove.classList.toggle('header-move');
+            });
+        
+        sideCloseButtons.forEach(button => {
+            button.addEventListener('click', function() {
+                sideMenu.classList.remove('active');
+                sideToggle.classList.remove('menu-opened');
+                content.classList.remove('content-open');
+                headermove.classList.remove('header-move');
+                body.classList.remove('block-scroll');
+                footermove.classList.remove('header-move');
+                });
+            });
+        })
+
+
+        var prevScrollPos = window.pageYOffset; 
+
+        window.onscroll = function() { 
+        var currentScrollPos = window.pageYOffset;
+        const getHeaderHeight = document.getElementById('header')
+        const headerPosition = header.offsetTop + header.offsetHeight;
+ 
+        if (prevScrollPos < currentScrollPos && currentScrollPos > headerPosition ) { 
+            document.getElementById("header").classList.add("header-hidden"); 
+            document.getElementById("header").classList.remove("header-visible"); 
+        }  
+        else { 
+            document.getElementById("header").classList.add("header-visible"); 
+            document.getElementById("header").classList.remove("header-hidden"); 
+        } 
+ 
+         prevScrollPos = currentScrollPos; 
+        };