Тестирование 5 веб-сайтов на наличие визуальных и функциональных ошибок
Требуется провести ручное тестирование пяти сайтов на предмет выявления багов интерфейса: проверка верстки, загрузки медиафайлов и работоспособности интерактивных элементов.
Задача
Реализовать мини-карту документа на HTML-странице (index.html). Мини-карта должна располагаться справа и отображать уменьшенную копию всего текстового содержимого страницы.
Основные требования
- Мини-карта должна работать как самостоятельный элемент страницы, без подключения внешних библиотек, если это возможно. Допускается использование библиотек Pagemap, Minimap-js или аналогов.
- Текст на странице должен быть легко заменяемым (редактируемым) - можно вставить любой другой текст, и мини-карта должна автоматически обновляться.
- Всё решение должно быть реализовано только средствами HTML + CSS + JavaScript в одном файле index.html.
- Мини-карта должна корректно отображаться для текстов разного объёма (от небольшого абзаца до документа на тысячи строк).
- Пользователь должен иметь возможность редактировать основной текст (например, обычное текстовое поле), а мини-карта сразу показывать изменения.
Функциональные детали
- При прокрутке основного текста мини-карта должна синхронно показывать текущую видимую область.
- Масштабирование мини-карты - произвольное, но такое, чтобы весь текст помещался на экране.
- Не требуется показывать переносы слов, сохраняется лишь общий контур блоков текста.
- Элементы управления (кнопки, ползунки) не обязательны, но приветствуются.