mojwp.ru
Назад

Как сделать карту Яндекс на сайте адаптивной

Вопрос: Как сделать карту Яндекс на сайте адаптивной, чтобы она хорошо смотрелась на мобильном телефоне, планшете и на компьютере?

Ответ: Чтобы сделать подобное, необходимо будет «взять» карту Яндекс в дополнительный контейнер div и задать ему максимальную ширину. Это нужно, чтобы она нормально смотрелась на компьютере.

А в самом скрипте карты мы заменим фиксированный параметр ширины на 100%.

Т.е. выглядеть ваш блок с картой будет так:

Обратите внимание:

  • max-width:600px; я выставляю максимальную ширину блока с картой. Вы ставите свой значение.
  • Уже в самом скрипте карты я заменил фикс. ширину на width=100%, чтобы она подстраивалась под размер экрана устройств.

Это самое простое решение и не требует подключения других скриптов, для адаптации карты.

Комментарии:
  • Kanmariks
    Опубликовано: 23.12.2015 Ответить на сообщение

    «Все клики одним цветом» — аналогично монохромной карте, но клики отображаются не областями, а точками.

  • Артур
    Опубликовано: 13.05.2018 Ответить на сообщение

    А что делать если ширина адаптируется бес проблем но высота нет?

  • Гость
    Опубликовано: 01.01.2019 Ответить на сообщение

    Большое спасибо! Очень помог!

  • Сергей
    Опубликовано: 26.01.2019 Ответить на сообщение

    Молодец! Реально выручил. Спасибо огромное

Имя
Укажите своё имя и фамилию
E-mail
Без СПАМа, обещаем
Текст сообщения
Отправляя данную форму, вы соглашаетесь с политикой конфиденциальности и правилами нашего сайта.