document.addEventListener("DOMContentLoaded", function() { // Array de contenidos var contents = [ { title: "Freshest Picks & Finest Cuts", content: "Welcome to Thrifty
Specialty Produce & Meats! ", bt1title: "FIND A STORE", bt2title: "WEEKLY AD", bt1link: "#11", bt2link: "#12", imgbanner: "https://thk.valcorpdigital.com/wp-content/uploads/2023/02/main-slider-img-1-dark.png" }, { title: "Taste the Difference", content: "Exceptional Selections
at Unbeatable Prices!", bt1title: "INSTACART
ONLINE ORDERIN", bt2title: "HOT FOOD &
CATERING ORDER", bt1link: "#21", bt2link: "#22", imgbanner: "https://www.thriftyspecialtyproduceandmeats.comwp-content/uploads/2024/02/meat.png" }, ]; var currentIndex = 0; var titleElement = document.querySelector('.tittlebanner'); var contentElement = document.querySelector('.contentban'); var bty = document.querySelector('.bty'); var btg = document.querySelector('.btg'); var imgone = document.querySelector('.main-slider__img-one'); var imagenbanner = document.getElementById("imagenbanner"); var miElemento = document.querySelector(".divani"); var btbanner = document.querySelector(".btbanner"); var miElemento2 = document.querySelector(".animatop"); function changeContent() { if (miElemento) { miElemento.classList.add("animatop"); } if (btbanner) { btbanner.classList.add("animatopdown"); } if (imgone) { imgone.classList.add("aniimgone"); } titleElement.innerHTML = contents[currentIndex].title; contentElement.innerHTML = contents[currentIndex].content; bty.innerHTML = contents[currentIndex].bt1title; btg.innerHTML = contents[currentIndex].bt2title; bty.href = contents[currentIndex].bt1link; btg.href = contents[currentIndex].bt2link; imagenbanner.src = contents[currentIndex].imgbanner; currentIndex = (currentIndex + 1) % contents.length; removeClassDelayed(); removeClassDelayed2(); removeClassDelayed3(); } function removeClassDelayed() { setTimeout(function() { miElemento.classList.remove("animatop"); }, 4000); // 4 segundos antes del cambio de contenido } function removeClassDelayed2() { setTimeout(function() { btbanner.classList.remove("animatopdown"); }, 4000); // 4 segundos antes del cambio de contenido } function removeClassDelayed3() { setTimeout(function() { imgone.classList.remove("aniimgone"); }, 4800); // 4 segundos antes del cambio de contenido } changeContent(); setInterval(changeContent, 5000); });