Ответить на тему  [ Сообщений: 3 ] 
Изображения - карта и адаптивность 
Автор Сообщение
Опытный

Зарегистрирован: 26 фев 2011, 23:28
Сообщений: 404
Откуда: Ростов-на-Дону
Пол: мужской
Репутация: 870
Добавить пункт репутацииВычесть пункт репутации
Сообщение Изображения - карта и адаптивность
Здравствуйте.
Помогите пожалуйста вот в таком вопросе. На сайте надо сделать изображение - карту, то есть нужные части изображения станут ссылками. Начал традиционно -
Код:
<img src="/chema.png" usemap="#Map" />
<map id="Map" name="Map">
<area alt="" coords="424,1,784,1,786,160,419,162" href="#" shape="poly" title="" />
<area alt="" coords="213,209,529,211,529,355,217,356" href="#" shape="poly" title="" />
<area alt="" coords="669,212,984,213,983,358,670,358" href="#" shape="poly" title="" />
</map>

Как бы все нормально. Но сайт должен быть адаптивным, а при изменении экрана координаты естественно съезжают.
Подскажите как такую проблему можно победить, какие вообще варианты имеются?


20 мар 2016, 19:13
Профиль Отправить личное сообщение
Опытный

Зарегистрирован: 12 дек 2011, 21:34
Сообщений: 542
Пол: мужской
Репутация: 1046
Добавить пункт репутацииВычесть пункт репутации
Сообщение Re: Изображения - карта и адаптивность
Можно координаты в процентах указывать...

Есть плагины, типа
1) https://github.com/davidjbradshaw/image-map-resizer
2) https://github.com/stowball/jQuery-rwdImageMaps
Есть модуль под Друпал https://www.drupal.org/project/responsive_imagemaps (второй плагин)

Но мне, всё-таки, больше нравится вот такой вариант - http://www.cssplay.co.uk/menu/cssplay-r ... e-map.html


20 мар 2016, 19:38
Профиль Отправить личное сообщение
Опытный

Зарегистрирован: 26 фев 2011, 23:28
Сообщений: 404
Откуда: Ростов-на-Дону
Пол: мужской
Репутация: 870
Добавить пункт репутацииВычесть пункт репутации
Сообщение Re: Изображения - карта и адаптивность
Большое спасибо.


20 мар 2016, 20:14
Профиль Отправить личное сообщение
Показать сообщения за:  Сортировать по:  
Ответить на тему   [ Сообщений: 3 ] 
   Похожие темы   Автор   Ответов   Просмотров   Последнее сообщение 
Нет новых непрочитанных сообщений в этой теме Вывод вводного изображения материала в произвольное место

в форуме ШАБЛОНЫ И ВНЕШНЕЕ ОФОРМЛЕНИЕ JOOMLA

panver

1

1720

27 дек 2013, 04:43

Алекесей Перейти к последнему сообщению

Нет новых непрочитанных сообщений в этой теме серая рамка вокруг пустого изображения в хроме

в форуме CSS И ВЕРСТКА

sveta

2

2350

28 ноя 2012, 15:43

sveta Перейти к последнему сообщению

Нет новых непрочитанных сообщений в этой теме Не правильное положение изображения внутри ячейки таблицы

в форуме CSS И ВЕРСТКА

Ilya

2

1538

19 ноя 2012, 09:47

Hoto Перейти к последнему сообщению

Нет новых непрочитанных сообщений в этой теме как сделать карту из своего изображения, а не рисуя народные

в форуме ВНЕШНИЕ РАСШИРЕНИЯ ДЛЯ JOOMLA

verok

6

1438

20 мар 2012, 17:00

Fatima Перейти к последнему сообщению

Нет новых непрочитанных сообщений в этой теме Не могу в редакторе вставить в текст свои изображения.

в форуме ФОРМИРОВАНИЕ СТРУКТУРЫ САЙТА И ВОПРОСЫ ПО ФУНКЦИОНИРОВАНИЮ СТАНДАРТНОЙ СБОРКИ JOOMLA

antonio

6

1203

31 окт 2010, 21:29

antonio Перейти к последнему сообщению


Кто сейчас на форуме

Сейчас этот форум просматривают: нет зарегистрированных пользователей и гости: 1


Вы не можете начинать темы
Вы не можете отвечать на сообщения
Вы не можете редактировать свои сообщения
Вы не можете удалять свои сообщения
Вы не можете добавлять вложения

Перейти:  
 cron