Как сделать карту Яндекс на сайте адаптивной
Вопрос: Как сделать карту Яндекс на сайте адаптивной, чтобы она хорошо смотрелась на мобильном телефоне, планшете и на компьютере?
Ответ: Чтобы сделать подобное, необходимо будет "взять" карту Яндекс в дополнительный контейнер div и задать ему максимальную ширину. Это нужно, чтобы она нормально смотрелась на компьютере.
А в самом скрипте карты мы заменим фиксированный параметр ширины на 100%.
Т.е. выглядеть ваш блок с картой будет так:
Обратите внимание:
- max-width:600px; я выставляю максимальную ширину блока с картой. Вы ставите свой значение.
- Уже в самом скрипте карты я заменил фикс. ширину на width=100%, чтобы она подстраивалась под размер экрана устройств.
Это самое простое решение и не требует подключения других скриптов, для адаптации карты.
«Все клики одним цветом» — аналогично монохромной карте, но клики отображаются не областями, а точками.
А что делать если ширина адаптируется бес проблем но высота нет?
Большое спасибо! Очень помог!
Молодец! Реально выручил. Спасибо огромное
Спасибо огромное! Все сразу получилось!
Блин, спасибо большое, очень помог!
Шёл 2021й...
Спасибо)
Всё гениальное просто !) Спасибо Большое !!!
Шёл 2023й...
Спасибо)
Шёл 2024й...
Спасибо)
Не получилось, карта размещается лишь в виде прямоугольной области по левой границе страницы при том, что в настройках ряда выставлено "во всю ширину + контент (без полей)"
Update: Получилось! После того, как изменил в скрипте максимальную ширину с 600 на 2048
Не работает. А если поставить width=100%, а height=77% ( это соотношение сторон контейнера 600х400), тогда работает.