Небольшая витрина ноутбуков и планшетов без фреймворков и сборки. Сохраняет исходную идею магазина, но работает как аккуратный самостоятельный сайт: изображения лежат рядом с кодом, поэтому карточки не зависят от внешней загрузки.
Ссылка на сайт: Открыть NoteDepot
9 карточек техники: ноутбуки Apple, ASUS, Acer, Lenovo и HP, а также iPad и планшеты Samsung/Lenovo.
Визуальный вариант MacBook Pro 14 сохранён; его фотографии только добавлены в локальную папку для автономной работы архива. Все используемые изображения подключены локально из assets/.
- У карточек с несколькими видами работают точки, смена ракурса движением мыши и касанием.
Нажатие на фото открывает увеличенный просмотр со стрелками и закрытием по `Esc`. Наведение на главный ноутбук слегка наклоняет и двигает его за курсором. Кнопка «Выбрать» подставляет модель в форму заявки.
Форма проверяет имя, телефон и выбранную модель и показывает понятный результат без всплывающих окон. Есть мобильное меню, адаптивная сетка и видимый фокус для клавиатуры.
| Действие | Результат |
|---|---|
| «Смотреть каталог» | Плавно прокручивает к товарам |
| Наведение на главный ноутбук | Лёгкий наклон и движение за курсором |
| Наведение на карточку | Увеличение текущего изображения |
| Движение по карточке | Смена ракурса, если у модели несколько фото |
| Точки под изображением | Ручной выбор ракурса |
| Клик по изображению | Большой просмотр |
Стрелки или ←/→ в просмотре |
Предыдущее/следующее фото |
Esc |
Закрытие просмотра или мобильного меню |
| «Выбрать» | Выбор модели в форме и переход к заявке |
| Отправка формы | Проверка полей и сообщение о результате |
Изображения сохранены локально и используются только как демонстрационные материалы витрины. Для коммерческой публикации замените их на файлы, на которые у вас есть права, сохранив имена или обновив пути в index.html.