From b7d4d6d1ee87e7b64afcb6e8136d1ff9443be5fa Mon Sep 17 00:00:00 2001 From: dadgam3er Date: Fri, 12 Sep 2025 16:08:22 +0000 Subject: [PATCH] FAQ fixed --- about.html | 115 ++++++++++++++++++++++++++++++++++++++++++++------- contact.html | 1 + script.js | 60 ++++++++++++++++----------- 3 files changed, 137 insertions(+), 39 deletions(-) diff --git a/about.html b/about.html index 52e4742..cc9be0b 100644 --- a/about.html +++ b/about.html @@ -125,64 +125,147 @@

Frequently Asked Questions

- +
-
-
-
-
-
-
@@ -195,5 +278,7 @@ tea experts.

+ + diff --git a/contact.html b/contact.html index a8c338b..1faef81 100644 --- a/contact.html +++ b/contact.html @@ -4,6 +4,7 @@ Contact Us - Global Tea Emporium +
diff --git a/script.js b/script.js index 4be906a..6438570 100644 --- a/script.js +++ b/script.js @@ -1,6 +1,42 @@ // Global Tea Emporium - Optimized JavaScript document.addEventListener("DOMContentLoaded", function () { + // ===== FAQ ACCORDION ===== + const faqQuestions = document.querySelectorAll(".faq-question"); + + faqQuestions.forEach((question) => { + question.addEventListener("click", function () { + const answer = this.nextElementSibling; + const toggle = this.querySelector(".faq-toggle"); + const isExpanded = this.getAttribute("aria-expanded") === "true"; + + // Close all other FAQ items + faqQuestions.forEach((otherQuestion) => { + if (otherQuestion !== this) { + const otherAnswer = otherQuestion.nextElementSibling; + const otherToggle = otherQuestion.querySelector(".faq-toggle"); + + otherQuestion.setAttribute("aria-expanded", "false"); + otherAnswer.classList.remove("active"); + otherToggle.classList.remove("active"); + } + }); + + // Toggle current FAQ item + this.setAttribute("aria-expanded", !isExpanded); + answer.classList.toggle("active"); + toggle.classList.toggle("active"); + }); + + // Add keyboard navigation + question.addEventListener("keydown", function (e) { + if (e.key === "Enter" || e.key === " ") { + e.preventDefault(); + this.click(); + } + }); + }); + // ===== IMAGE GALLERY ===== const galleryImages = [ { @@ -58,7 +94,6 @@ document.addEventListener("DOMContentLoaded", function () { thumb.addEventListener("click", () => updateGallery(index)); }); - // Auto-advance every 10 seconds setInterval(nextImage, 10000); @@ -134,29 +169,6 @@ document.addEventListener("DOMContentLoaded", function () { }); } - // ===== FAQ ACCORDION ===== - document.querySelectorAll(".faq-question").forEach((question) => { - question.addEventListener("click", function () { - const answer = this.nextElementSibling; - const toggle = this.querySelector(".faq-toggle"); - const isOpen = this.getAttribute("aria-expanded") === "true"; - - // Close all other FAQs - document.querySelectorAll(".faq-question").forEach((q) => { - if (q !== this) { - q.setAttribute("aria-expanded", "false"); - q.nextElementSibling?.classList.remove("active"); - q.querySelector(".faq-toggle")?.classList.remove("active"); - } - }); - - // Toggle current FAQ - this.setAttribute("aria-expanded", !isOpen); - answer?.classList.toggle("active"); - toggle?.classList.toggle("active"); - }); - }); - // ===== HOVER EFFECTS ===== document .querySelectorAll(".services-list li, .value-item, .timeline-item")