Задать вопрос
@mozzart_live
html

Как сделать резиновую карту с метками?

Коллеги, добрый день!

Есть фотография местности, на всю ширину экрана, на ней размещены метки, как их грамотно закрепить к определенной области, при учете, что масштаб карты подстраивается под разрешение экрана?

Макетик: https://prnt.sc/l7164t
  • Вопрос задан
  • 388 просмотров
2 комментария
Подписаться 4 Средний 2 комментария
Пригласить эксперта
Ответы на вопрос 3
Vlad_IT
@Vlad_IT Куратор тега CSS
Front-end разработчик
Создаете svg блок, указываете ему viewBox="0 0 ширина_картинки высота_картинки", в него кидаете картинку и все необходимые точки


UPD: вариант на css с сохранением размеров маркеров
Ответ написан
5 комментариев
5 комментариев
Nikita-Fast
@Nikita-Fast
SVGшник и леплю что попало
Ну я как обычно про SVG говорю
даже события можно повесить на разные маркеры разные события
только там не карта а фотка обычная
или надо отрисовать ?
Ответ написан
Комментировать
Комментировать
profesor08
@profesor08 Куратор тега CSS
Располагать относительно при помощи % или vh, vw.
Ответ написан
2 комментария
2 комментария
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
Тестировщик-стажёр
ITooLabs • Тула
от 35 000 до 40 000 ₽
Fullstack PHP Developer
Smapse Education
от 40 000 до 65 000 ₽
Trainee - IT Support
move2usajobs.com LLC • Лос-Анджелес
от 2 000 до 4 000 $
Ещё вакансии
Заказы с Хабр Фриланса
Исправление ошибок в работе вебсайта / Доработка интернет-магазина
24 апр. 2024, в 02:51
50000 руб./за проект
Анимация логотипа
24 апр. 2024, в 00:08
20000 руб./за проект
Разработка дизайна раздела «Статьи» на сайте «Мир отходов»
23 апр. 2024, в 23:01
10000 руб./за проект
Ещё заказы