64 lines
2.5 KiB
JavaScript
64 lines
2.5 KiB
JavaScript
document.addEventListener('DOMContentLoaded', function() {
|
|
const menuToggle = document.getElementById('menuToggle');
|
|
const mainNav = document.querySelector('.main-nav');
|
|
const body = document.body;
|
|
|
|
// Ustvari overlay element
|
|
let overlay = document.querySelector('.menu-overlay');
|
|
if (!overlay) {
|
|
overlay = document.createElement('div');
|
|
overlay.className = 'menu-overlay';
|
|
document.body.appendChild(overlay);
|
|
}
|
|
|
|
if (menuToggle && mainNav) {
|
|
menuToggle.addEventListener('click', function() {
|
|
mainNav.classList.toggle('active');
|
|
overlay.classList.toggle('active');
|
|
body.classList.toggle('menu-open');
|
|
menuToggle.classList.toggle('active');
|
|
|
|
// Dodaj aria-expanded za dostopnost
|
|
const isExpanded = mainNav.classList.contains('active');
|
|
menuToggle.setAttribute('aria-expanded', isExpanded);
|
|
|
|
// Eksplicitno nastavi display stil
|
|
mainNav.style.display = isExpanded ? 'block' : 'none';
|
|
});
|
|
|
|
// Zapri meni ob kliku na overlay
|
|
overlay.addEventListener('click', function() {
|
|
mainNav.classList.remove('active');
|
|
overlay.classList.remove('active');
|
|
body.classList.remove('menu-open');
|
|
menuToggle.classList.remove('active');
|
|
menuToggle.setAttribute('aria-expanded', 'false');
|
|
mainNav.style.display = 'none';
|
|
});
|
|
|
|
// Zapri meni ob kliku na povezavo v meniju
|
|
const menuLinks = mainNav.querySelectorAll('a');
|
|
menuLinks.forEach(link => {
|
|
link.addEventListener('click', function() {
|
|
mainNav.classList.remove('active');
|
|
overlay.classList.remove('active');
|
|
body.classList.remove('menu-open');
|
|
menuToggle.classList.remove('active');
|
|
menuToggle.setAttribute('aria-expanded', 'false');
|
|
mainNav.style.display = 'none';
|
|
});
|
|
});
|
|
|
|
// Zapri meni ob resize-u okna
|
|
window.addEventListener('resize', function() {
|
|
if (window.innerWidth > 768) {
|
|
mainNav.classList.remove('active');
|
|
overlay.classList.remove('active');
|
|
body.classList.remove('menu-open');
|
|
menuToggle.classList.remove('active');
|
|
menuToggle.setAttribute('aria-expanded', 'false');
|
|
mainNav.style.removeProperty('display');
|
|
}
|
|
});
|
|
}
|
|
});
|