Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 17.06.2016, 14:44   #1
werwolf4
Новичок
Джуниор
 
Регистрация: 17.06.2016
Сообщений: 1
По умолчанию Адаптивная верстка и активное изображение

Всем привет.
Столкнулся с такой проблемой.
Есть план торгового центра, его необходимо сделать активным, т.е. при наведении на определенный объект должна всплывать подсказка с карточкой арендатора помещения.
Изначально попробовал реализовать это через карту изображения (map area), но этот вариант не подходит для сайта с адаптивной версткой. Изображение уменьшается а координаты областей остаются прежними.
Если кто то сталкивался с такой задачей подскажите варианты ее решения.
Заранее спасибо за помощь.
werwolf4 вне форума Ответить с цитированием
Старый 17.06.2016, 15:55   #2
pompiduskus
юзер как все
Участник клуба
 
Аватар для pompiduskus
 
Регистрация: 10.01.2012
Сообщений: 1,586
По умолчанию

Может брать кординаты относительные родителя ?

Если родитель 80% то, все кординаты у дочерних елементов (оригинальная ширина * 0.8)
Если родитель 40% то, все кординаты у дочерних елементов (оригинальная ширина * 0.4)

Как вариант.
<Дзен - Вся вселенная в тебе > | Резюме: https://ch3ll0v3k.github.io/CV/
pompiduskus вне форума Ответить с цитированием
Старый 17.06.2016, 21:45   #3
Naive
Раздолбайских Дел
Старожил
 
Аватар для Naive
 
Регистрация: 22.05.2009
Сообщений: 3,828
По умолчанию

pompiduskus, годный вариант.
1. Еще можно юзануть флеш
2. JavaScript, если умеете задавать область и определять попадание курсора в нее
3. canvas с его активными областями
4. CSS сложной формы (http://www.gen-su.ru/ упрощенно, но как пример)
5. image-map и ресайз карты средствами transform, свой функционал внутри себя она сохранит в собственных пикселях.
6. SVG

пс. я бы выбрал 4 вариант, или если ахренеть какие сложные фигуры, то pomp-a.
Alar, верни репу!
Naive вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Адаптивная верстка на Бутстрапе Capz HTML и CSS 1 26.03.2015 09:50
Адаптивная верстка kostya67 HTML и CSS 3 01.02.2015 10:53
Адаптивная верстка сайта Андрей79 HTML и CSS 0 05.04.2014 18:16
как узнать, что окно активное/не активное beegl Общие вопросы Delphi 6 01.01.2013 22:48
Активное изображение. Necare HTML и CSS 6 21.03.2011 19:51