MediaWiki:Common.js: Unterschied zwischen den Versionen
Aus Phoenix-Larp Wiki
Becko (Diskussion | Beiträge) Der Seiteninhalt wurde durch einen anderen Text ersetzt: „→Das folgende JavaScript wird für alle Benutzer geladen.: “ Markierung: Ersetzt |
Becko (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
||
| Zeile 1: | Zeile 1: | ||
/* Das folgende JavaScript wird für alle Benutzer geladen. */ | /* Das folgende JavaScript wird für alle Benutzer geladen. */ | ||
mw.loader.using(['mediawiki.util']).done(function () { | |||
// Nur auf schmalen Screens aktiv werden | |||
if (!window.matchMedia('(max-width: 768px)').matches) return; | |||
// Burger-Button einfügen (Barrierefreiheit beachten) | |||
var $btn = $('<button class="mw-burger" aria-label="Menü" aria-controls="mw-panel" aria-expanded="false"><span></span></button>'); | |||
$('body').append($btn); | |||
// Overlay zum Schließen per Tap | |||
var $overlay = $('<div class="nav-overlay" tabindex="-1" aria-hidden="true"></div>'); | |||
$('body').append($overlay); | |||
function closeMenu() { | |||
$('body').removeClass('nav-open'); | |||
$btn.attr('aria-expanded', 'false'); | |||
} | |||
function toggleMenu() { | |||
var open = !$('body').hasClass('nav-open'); | |||
$('body').toggleClass('nav-open', open); | |||
$btn.attr('aria-expanded', String(open)); | |||
} | |||
$btn.on('click', toggleMenu); | |||
$overlay.on('click', closeMenu); | |||
$(document).on('keydown', function (e) { | |||
if (e.key === 'Escape') closeMenu(); | |||
}); | |||
}); | |||
Version vom 9. Oktober 2025, 08:28 Uhr
/* Das folgende JavaScript wird für alle Benutzer geladen. */
mw.loader.using(['mediawiki.util']).done(function () {
// Nur auf schmalen Screens aktiv werden
if (!window.matchMedia('(max-width: 768px)').matches) return;
// Burger-Button einfügen (Barrierefreiheit beachten)
var $btn = $('<button class="mw-burger" aria-label="Menü" aria-controls="mw-panel" aria-expanded="false"><span></span></button>');
$('body').append($btn);
// Overlay zum Schließen per Tap
var $overlay = $('<div class="nav-overlay" tabindex="-1" aria-hidden="true"></div>');
$('body').append($overlay);
function closeMenu() {
$('body').removeClass('nav-open');
$btn.attr('aria-expanded', 'false');
}
function toggleMenu() {
var open = !$('body').hasClass('nav-open');
$('body').toggleClass('nav-open', open);
$btn.attr('aria-expanded', String(open));
}
$btn.on('click', toggleMenu);
$overlay.on('click', closeMenu);
$(document).on('keydown', function (e) {
if (e.key === 'Escape') closeMenu();
});
});