почему это меню видят гости весь форум скрыт от гостей а эту менюшку можно как то закрыть?
Код:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Меню быстрого доступа</title>
<!-- jQuery CDN -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<style>
:root {
--primary-color: #f0f0f0;
--bg-color: #f9f9f9;
--text-color: #333;
--hover-bg: #f8f8f8;
--shadow: rgba(0, 0, 0, 0.1);
}
body {
margin: 0;
font-family: Arial, sans-serif;
background: #fff;
}
* {
box-sizing: border-box;
}
.slide-panel-toggle {
position: fixed;
right: 0;
top: 130px;
width: 40px;
height: 40px;
background-color: white;
border: 2px solid #ccc;
border-radius: 8px 0 0 8px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
font-size: 20px;
color: #000;
font-weight: bold;
user-select: none;
box-shadow: 0 2px 4px var(--shadow);
z-index: 998;
transition: transform 0.2s ease;
}
.slide-panel-toggle:focus {
outline: 2px solid #fff;
outline-offset: 2px;
}
.slide-panel {
position: fixed;
right: -380px;
top: 750px;
width: 380px;
max-height: 80vh;
overflow-y: auto;
background: var(--bg-color);
border: 1px solid #ccc;
border-right: none;
box-shadow: -4px 0 8px var(--shadow);
border-radius: 8px 0 10 8px;
padding: 80px;
font-family: Arial, sans-serif;
font-size: 14px;
color: var(--text-color);
transition: right 0.4s ease;
z-index: 209;
}
.slide-panel.opened {
right: 0;
}
@media (max-width: 480px) {
.slide-panel {
width: 100%;
right: -48%;
}
.slide-panel.opened {
right: 0;
}
}
.menu-item {
display: flex;
align-items: center;
justify-content: flex-start;
width: 333%;
padding: 12px 10px 12px 15px;
margin: 8px 0;
border-radius: 8px;
background: linear-gradient(to bottom, #ffffff, #fafafa);
color: #222;
font-size: 15px;
cursor: pointer;
text-decoration: none;
height: 44px;
transition: all 0.3s ease;
border: 1px solid #e0e0e0;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.32);
text-align: left;
}
.menu-item:hover,
.menu-item:focus {
background: linear-gradient(to bottom, var(--hover-bg), #f0f0f0);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.88);
transform: translateY(-2px);
outline: 2px solid var(--primary-color);
outline-offset: 2px;
}
.menu-item:active {
transform: translateY(0);
}
#ipServer {
background: linear-gradient(to bottom, #ffffff, #fafafa);
}
.menu-item.no-click {
cursor: default;
font-weight: bold;
font-size: 333;
color: #333;
pointer-events: none;
user-select: none;
text-align: center;
background: none;
border: none;
box-shadow: none;
margin-bottom: 20px;
height: auto;
padding: 10px 0;
}
</style>
</head>
<body>
<!-- Кнопка для открытия/закрытия меню -->
<button class="slide-panel-toggle" aria-label="Открыть/Закрыть меню" aria-expanded="false" title="Открыть меню быстрого доступа">«</button>
<!-- Меню -->
<nav class="slide-panel" role="navigation" aria-label="Меню быстрого доступа">
<div class="menu-item no-click" tabindex="-1" aria-disabled="true">
Меню быстрого доступа
</div>
<a href="https://vk.com/id1061844450" target="_blank" class="menu-item" rel="noopener">Мы вконтакте</a>
<button id="ipServer" class="menu-item" aria-label="Копировать IP сервера">IP сервера: 217.322.554.86:7002</button>
<a id="founder-link" href="https://relaxrpe.forumes.ru/profile.php?id=2" target="_blank" class="menu-item" rel="noopener">Основатель сервера Murfikkkk</a>
<a href="https://relaxrpe.forumes.ru/viewforum.php?id=4333" target="_blank" class="menu-item" rel="noopener">Общие правила</a>
<a href="https://relaxrpe.forumes.ru/viewtopic.php?id=3222" target="_blank" class="menu-item" rel="noopener">Правила захвата территорий</a>
<a href="https://relaxrpe.forumes.ru/viewtopic.php?id=333" target="_blank" class="menu-item" rel="noopener">Правила войны за бизнесы</a>
</nav>
<script>
$(document).ready(function() {
const $toggle = $(".slide-panel-toggle");
const $panel = $(".slide-panel");
$toggle.click(function() {
$panel.toggleClass("opened");
const isOpened = $panel.hasClass("opened");
$toggle.html(isOpened ? "»" : "«");
$toggle.attr("aria-expanded", isOpened);
});
$("#ipServer").click(function() {
const ip = "217.106.106.86:7002";
if (navigator.clipboard && window.isSecureContext) {
navigator.clipboard.writeText(ip).then(() => {
alert("IP сервера скопирован!");
}).catch(() => {
fallbackCopyTextToClipboard(ip);
});
} else {
fallbackCopyTextToClipboard(ip);
}
});
function fallbackCopyTextToClipboard(text) {
const textArea = document.createElement("textarea");
textArea.value = text;
document.body.appendChild(textArea);
textArea.focus();
textArea.select();
try {
document.execCommand('copy');
alert("IP сервера скопирован!");
} catch (err) {
alert("Не удалось скопировать. Скопируйте вручную: " + text);
}
document.body.removeChild(textArea);
}
$(document).click(function(e) {
if (!$panel.is(e.target) && !$panel.has(e.target).length && !$toggle.is(e.target)) {
$panel.removeClass("opened");
$toggle.html("«");
$toggle.attr("aria-expanded", "false");
}
});
});
</script>
</body>
</html>
