Кто-нибудь знает, почему меню гамбургеров работает в моей виртуальной среде, но не на реальном сервере? [закрыто] ⇐ CSS

[Anonymous]

Все мои CSS HTML и JS работают в моей виртуальной среде Python/Flask, но не на живом или мобильном сервере. Кто-нибудь знает, почему и как я могу это исправить? CSS в основном присутствует везде, потому что, начиная с мобильной области просмотра, однако мое навигационное меню бургера работает в виртуальной среде, но не отображается на реальном сервере. меню отображается вертикально, однако кнопки «Бургер» нет на экране, и сценарий Js для нее не работает. И, пожалуйста, не судите, лол; Я не мог придумать проект, поскольку сейчас занимаюсь самообучением кодированию, и это страница Илона Маска.

< div class="snippet-code">

Код: Выделить всё

console.log("Script loaded");
console.log("toggleDropdown function called");
function toggleDropdown(dropdownId) {
console.log("Toggling dropdown with id:", dropdownId); // Debug Log
const dropdown = document.getElementById(dropdownId);
if (dropdown) {
console.log("Dropdown element found, toggling class");
dropdown.classList.toggle("show");
console.log("Current classes:", dropdown.className); // Check if class was toggled
} else {
console.log("Error: Dropdown element not found");
}
}

// Close dropdown menus when clicking outside
document.addEventListener('click', function (event) {
const isClickInsideDropdown = event.target.closest('.dropdown') !== null;
if (!isClickInsideDropdown) {
const dropdowns = document.querySelectorAll('.dropdown-content.show');
dropdowns.forEach(function (dropdown) {
dropdown.classList.remove('show');
});
}
});

// Close dropdowns with the Escape key
document.addEventListener('keydown', function (event) {
if (event.key === 'Escape') {
const dropdowns = document.querySelectorAll('.dropdown-content.show');
dropdowns.forEach(function (dropdown) {
dropdown.classList.remove('show');
});
}
});

function setupDropdownBehavior() {
const dropdownBtns = document.querySelectorAll('.dropbtn');
const dropdownMenus = document.querySelectorAll('.dropdown-content');

if (window.innerWidth  {
btn.onclick = (e) => {
e.stopPropagation(); // Prevent click from propagating
const dropdown = btn.nextElementSibling;
dropdownMenus.forEach((menu) => {
if (menu !== dropdown) {
menu.classList.remove("show"); // Close other menus
}
});
dropdown.classList.toggle("show");
};
});

// Hide all menus when clicking outside
document.onclick = () => {
dropdownMenus.forEach((menu) => {
menu.classList.remove("show");
});
};

// Remove floating behavior for smaller screens
dropdownMenus.forEach((menu) => {
menu.style.position = "static";
});
} else {
// For larger screens: enable hover and disable click behavior
dropdownBtns.forEach((btn) => {
btn.onclick = null; // Remove click behavior
});

// Reset floating behavior
dropdownMenus.forEach((menu) => {
menu.style.position = ""; // Reset to default (absolute)
menu.classList.remove("show"); // Ensure no lingering "show" class
});
}
}

// Combine event listeners for both resize and load events
window.addEventListener('load', function() {
setupDropdownBehavior();
checkScreenSize();
});

// Resize event listener
window.addEventListener('resize', function() {
setupDropdownBehavior();
checkScreenSize();
});

function toggleBurgerMenu() {
const menu = document.querySelector('.menu-items');
menu.classList.toggle('active');
}

function checkScreenSize() {
const searchBar = document.getElementById('searchbar');

// Hide the search bar if screen size is smaller than or equal to 768px
if (window.innerWidth 

Подробнее здесь: [url]https://stackoverflow.com/questions/79240554/does-anyone-know-why-burger-menu-works-in-my-virtual-environment-but-not-on-a-li[/url]