Files
local-content-pro/assets/js/lcp-ui.js
2024-12-30 19:23:48 -08:00

52 lines
1.8 KiB
JavaScript

document.addEventListener('DOMContentLoaded', function () {
// Find all elements with the class "lcp-accordion"
var accordions = document.querySelectorAll('.lcp-accordion');
accordions.forEach(function (accordion) {
// Find all tabs within the current accordion
var tabs = accordion.querySelectorAll('.lcp-accordion-tab');
tabs.forEach(function (tab) {
var header = tab.querySelector('h3');
var content = tab.querySelector('.lcp-accordion-content');
// Add click event to each header to toggle the content
header.addEventListener('click', function () {
// Toggle the 'active' class on the tab to show/hide content
tab.classList.toggle('active');
// Optional: Close other open tabs (if only one tab should be open at a time)
tabs.forEach(function (otherTab) {
if (otherTab !== tab) {
otherTab.classList.remove('active');
}
});
});
});
});
});
document.addEventListener('DOMContentLoaded', function () {
const tabs = document.querySelectorAll('.tab-link');
const panes = document.querySelectorAll('.tab-pane');
tabs.forEach(tab => {
tab.addEventListener('click', function (event) {
event.preventDefault();
// Remove active class from all tabs and panes
tabs.forEach(link => link.classList.remove('active'));
panes.forEach(pane => pane.classList.remove('active'));
// Add active class to the clicked tab and its corresponding pane
tab.classList.add('active');
const targetPane = document.querySelector(tab.getAttribute('href'));
targetPane.classList.add('active');
});
});
});