MediaWiki:Common.js: Difference between revisions
From Ultimate Dragon Ball Online Wiki
Ravenalien (talk | contribs) No edit summary |
Ravenalien (talk | contribs) No edit summary |
||
| Line 5: | Line 5: | ||
// Main tab click handler | // Main tab click handler | ||
$('.tab-navigation | $('.tab-navigation .tab-button').click(function(e) { | ||
e.preventDefault(); | e.preventDefault(); | ||
var targetId = $(this).data('target'); | var targetId = $(this).data('target'); | ||
if ($(this).closest('.tab-navigation').length) { | |||
// Main tab clicked | |||
$('.tab-navigation .tab-button').removeClass('active'); | |||
$('.tab-content .tab-pane').removeClass('active'); | |||
$(this).addClass('active'); | |||
$('#' + targetId).addClass('active'); | |||
$ | |||
$('#' + | |||
} | } | ||
}); | }); | ||
// Sub-tab click handler | // Sub-tab click handler - separate from main tab handler | ||
$('.sub-tab-navigation | $('.sub-tab-navigation .tab-button').click(function(e) { | ||
e.preventDefault(); | e.preventDefault(); | ||
e.stopPropagation(); // Prevent event from bubbling up | |||
var targetId = $(this).data('target'); | var targetId = $(this).data('target'); | ||
var $subNav = $(this).closest('.sub-tab-navigation'); | var $subNav = $(this).closest('.sub-tab-navigation'); | ||
// | // Only affect buttons and panes within this sub-tab-navigation | ||
$subNav.find(' | $subNav.find('.tab-button').removeClass('active'); | ||
$subNav.find('.tab-pane').removeClass('active'); | |||
$(this).addClass('active'); | $(this).addClass('active'); | ||
$('#' + targetId).addClass('active'); | $('#' + targetId).addClass('active'); | ||
}); | }); | ||
// Set initial states | // Set initial states for main tabs | ||
$('.tab-navigation').each(function() { | $('.tab-navigation').each(function() { | ||
var $ | var $nav = $(this); | ||
var $activeTab = $nav.find('.tab-button.active'); | |||
if (!$activeTab.length) { | |||
if (!$ | $activeTab = $nav.find('.tab-button').first(); | ||
$activeTab.addClass('active'); | |||
$ | $('#' + $activeTab.data('target')).addClass('active'); | ||
} | } | ||
}); | }); | ||
// | // Set initial states for sub-tabs | ||
$('.sub-tab-navigation').each(function() { | |||
var $subNav = $(this); | |||
var | var $activeSubTab = $subNav.find('.tab-button.active'); | ||
var $ | |||
if ( | if (!$activeSubTab.length) { | ||
$activeSubTab = $subNav.find('.tab-button').first(); | |||
$ | $activeSubTab.addClass('active'); | ||
$('#' + $activeSubTab.data('target')).addClass('active'); | |||
} | } | ||
} | }); | ||
}); | }); | ||
Revision as of 06:45, 26 February 2025
/* Any JavaScript here will be loaded for all users on every page load. */
$(document).ready(function() {
'use strict';
// Main tab click handler
$('.tab-navigation .tab-button').click(function(e) {
e.preventDefault();
var targetId = $(this).data('target');
if ($(this).closest('.tab-navigation').length) {
// Main tab clicked
$('.tab-navigation .tab-button').removeClass('active');
$('.tab-content .tab-pane').removeClass('active');
$(this).addClass('active');
$('#' + targetId).addClass('active');
}
});
// Sub-tab click handler - separate from main tab handler
$('.sub-tab-navigation .tab-button').click(function(e) {
e.preventDefault();
e.stopPropagation(); // Prevent event from bubbling up
var targetId = $(this).data('target');
var $subNav = $(this).closest('.sub-tab-navigation');
// Only affect buttons and panes within this sub-tab-navigation
$subNav.find('.tab-button').removeClass('active');
$subNav.find('.tab-pane').removeClass('active');
$(this).addClass('active');
$('#' + targetId).addClass('active');
});
// Set initial states for main tabs
$('.tab-navigation').each(function() {
var $nav = $(this);
var $activeTab = $nav.find('.tab-button.active');
if (!$activeTab.length) {
$activeTab = $nav.find('.tab-button').first();
$activeTab.addClass('active');
$('#' + $activeTab.data('target')).addClass('active');
}
});
// Set initial states for sub-tabs
$('.sub-tab-navigation').each(function() {
var $subNav = $(this);
var $activeSubTab = $subNav.find('.tab-button.active');
if (!$activeSubTab.length) {
$activeSubTab = $subNav.find('.tab-button').first();
$activeSubTab.addClass('active');
$('#' + $activeSubTab.data('target')).addClass('active');
}
});
});