MediaWiki:Common.js: Difference between revisions
Jump to navigation
Jump to search
mNo edit summary |
No edit summary |
||
Line 1: | Line 1: | ||
/* Any JavaScript here will be loaded for all users on every page load. */ | /* Any JavaScript here will be loaded for all users on every page load. */ | ||
/*Collapsible Icon Menu*/ | /* Collapsible Icon Menu */ | ||
document.addEventListener("DOMContentLoaded", function() { | |||
var icons = document.querySelectorAll('.collapsible-icon'); | var icons = document.querySelectorAll('.collapsible-icon'); | ||
var contents = document.querySelectorAll('.collapsible-content'); | var contents = document.querySelectorAll('.collapsible-content'); | ||
if (icons.length === 0 || contents.length === 0) { | |||
console.error("No icons or content sections found."); | |||
return; | |||
} | |||
icons.forEach(function(icon, index) { | icons.forEach(function(icon, index) { | ||
function toggleContent() { | function toggleContent() { | ||
console.log("Icon clicked:", index); // Debugging | |||
// Remove 'active' class from all icons and content sections | // Remove 'active' class from all icons and content sections | ||
icons.forEach(function(icon) { | icons.forEach(function(icon) { | ||
Line 22: | Line 29: | ||
icon.addEventListener('click', toggleContent); | icon.addEventListener('click', toggleContent); | ||
icon.addEventListener('touchstart', toggleContent); | icon.addEventListener('touchstart', function(e) { | ||
e.preventDefault(); // Prevents default touch behavior | |||
toggleContent(); | |||
}); | |||
}); | }); | ||
}; | }); |
Revision as of 17:27, 18 May 2024
/* Any JavaScript here will be loaded for all users on every page load. */ /* Collapsible Icon Menu */ document.addEventListener("DOMContentLoaded", function() { var icons = document.querySelectorAll('.collapsible-icon'); var contents = document.querySelectorAll('.collapsible-content'); if (icons.length === 0 || contents.length === 0) { console.error("No icons or content sections found."); return; } icons.forEach(function(icon, index) { function toggleContent() { console.log("Icon clicked:", index); // Debugging // Remove 'active' class from all icons and content sections icons.forEach(function(icon) { icon.classList.remove('active'); }); contents.forEach(function(content) { content.classList.remove('active'); }); // Add 'active' class to the clicked icon and its corresponding content icons[index].classList.add('active'); contents[index].classList.add('active'); } icon.addEventListener('click', toggleContent); icon.addEventListener('touchstart', function(e) { e.preventDefault(); // Prevents default touch behavior toggleContent(); }); }); });