MediaWiki:Common.js: Difference between revisions

From ANZUS Wiki
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 */
window.onload = function() {
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();
        });
    });
});