Плавное меню при загрузке страницы
Вот пример кода на HTML и CSS, который создает верхнее меню, плавно опускающееся сверху при загрузке страницы:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Плавное меню</title>
<style>
body {
margin: 0;
font-family: Arial, sans-serif;
}
.menu {
position: fixed;
top: -100px; /* Начальная позиция вне экрана */
left: 0;
right: 0;
background-color: #333;
color: white;
padding: 10px;
text-align: center;
transition: top 0.5s ease; /* Плавный переход */
}
.menu.show {
top: 0; /* Конечная позиция */
}
</style>
</head>
<body>
<div class="menu" id="menu">
Меню
</div>
<script>
window.onload = function() {
const menu = document.getElementById('menu');
menu.classList.add('show'); // Добавляем класс для показа меню
};
</script>
</body>
</html>Объяснение:
HTML: Создается фиксированное меню, которое изначально находится вне экрана.
CSS: Используется свойство transition для плавного изменения позиции меню.
JavaScript: При загрузке страницы добавляется класс show, который изменяет позицию меню, заставляя его плавно опуститься сверху.
Проверка валидности email на PHP 8.2
<?php
function isValidEmail(string $email): bool {
return filter_var($email, FILTER_VALIDATE_EMAIL) !== false;
}
// Пример использования
$email = "example@example.com";
if (isValidEmail($email)) {
echo "Email корректен.";
} else {
echo "Email некорректен.";
}
?>В этом коде используется функция filter_var с фильтром FILTER_VALIDATE_EMAIL, что позволяет эффективно проверять корректность email-адреса.
Если не работает L2TP/IPSec на Windows 10
Не удалось установить связь по сети между компьютером и VPN-сервером, так как удаленный сервер не отвечает. Возможная причина: одно из сетевых устройств (таких как брандмауэры, NAT, маршрутизаторы и т.п.) между компьютером и удаленным сервером не настроено для разрешения VPN-подключений. Чтобы определить, какое устройство вызывает эту проблему, обратитесь к администратору или поставщику услуг.
Если у вас при подключении отображается такая же ошибка, решение давно известно.
Уведомления с кнопкой «Больше не показывать»
<div id="alert" class="alert alert-info hide" style="overflow: hidden;">
<p style="margin-bottom: 24px;">Уведомление, которое можно закрыть!</p>
<button type="button" class="btn btn-info pull-right" data-dismiss="alert">
Больше не показывать</button>
</div>Скрипт, который будет сохранять состояние в Local Strorage:
if (!localStorage.getItem('alert')) {
$('#alert').removeClass('hide');
$('#alert').on('closed.bs.alert', function() {
localStorage.setItem('alert', 1);
});
}Объекты веб-хранилища localStorage и sessionStorage позволяют хранить пары ключ/значение в браузере. Что в них важно – данные, которые в них записаны, сохраняются после обновления страницы (в случае sessionStorage ) и даже после перезапуска браузера (при использовании localStorage ).
Он не имеет ограничений по времени хранения, может быть очищен пользователем вручную или браузером при переполнении автоматически (браузеры на основе движка WebKit, например Safari, очищают localStorage , если к нему не обращались в течение 7 дней). Максимальный объем данных ограничен размером 5MB.
Авто-получение бесплатного SSL сертификата от Let’s Encrypt
В этой статье я расскажу как воспользоваться одним из удобных способов для автоматизации получения бесплатного SSL сертификата от Let’s Encrypt. Данный способ, на мой взгляд, очень удобен. Для его функционирования не нужно вводить команды в консоли, а все операции выполняются в вашем любимом браузере.