Модераторы: Sardar, Aliance
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Area на картинке с переменным размером, Картинка по ширине окна 
V
    Опции темы
rodendron
Дата 30.1.2006, 15:10 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 152
Регистрация: 22.3.2005

Репутация: нет
Всего: нет



Добрый день всем.
Хотел такой вопрос задать - по поводу событий при наведении на картинку мышкой.
Так вот, мы можем чтобы когда навели на определенное место на рисунке выводить данные по событию onover.
Только вот вопрос такой, я изначально задаю координаты на моей картинке.
А не сталкивались ли с ситуацией, что картинка отображается как width=100% и поэтому динамически изменяется под различные расширения экрана.
Как в таком случае быть с координатами?
Есть ли какое-либо здравое решение, чтобы можно было задавать координаты динамически?
Заранее благодарен.
PM MAIL   Вверх
dstorm81
Дата 30.1.2006, 15:50 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


бездельник
***


Профиль
Группа: Завсегдатай
Сообщений: 1178
Регистрация: 18.1.2006
Где: (16RU)

Репутация: 20
Всего: 39



а картинка как растягивается, пропорционально или нет



--------------------
на форуме с 8.12.2002 (http://forum.vingrad.ru/index.php?act=ST&f=10&t=4874&st=0#)

PM   Вверх
rodendron
Дата 30.1.2006, 16:02 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 152
Регистрация: 22.3.2005

Репутация: нет
Всего: нет



dstorm81
Изначально делаю ее максимальной. 1280 на 1024.
А потом подразумеваю что она будет отображаться и на 800 на 600.
Точнее так и происходит.
Если делать наоборот - будет маленькая растягиваться. А тут большая уменьшается. Хотел при наводе мышкой на людей делать вывод характеристик. Такая стоит задача.
Добавлено @ 16:05
Я конечно могу сделать под все разрешения экрана. Но потом делать координаты для каждого - довольно муторно. Вот и хотел с вами посовещаться.
PM MAIL   Вверх
12345c
Дата 30.1.2006, 16:36 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Круглый
****


Профиль
Группа: Vingrad developer
Сообщений: 2018
Регистрация: 26.12.2005
Где: наша не пропадала ?

Репутация: 57
Всего: 101



Видел недавно на подобном форуме такой же вопрос. Но без решения. Там человек хотел, чтобы у него работал атрибут width=100% в теге IMG и недоумевал, почему он не работает. Картинки под это не рассчитаны, поэтому остаётся контролировать размер скриптом, ловя событие onresize.

Код
<img src=snow.gif height=100 id=i2>
<script>d=document; 
onload=onresize=function(){
    d.getElementById('i2').style.width=d.all?d.body.clientWidth-2*d.body.leftMargin:innerWidth-24;
}
</script>
(Не нашёл, как в Мозилле считывать отступы документа от краёв - d.body.leftMargin для IE . )


--------------------
Google Code Playground - онлайн-отладка своих примеров HTML+JS без регистрации, с сохранением по URL, без кириллицы. Go
PM WWW   Вверх
rodendron
Дата 31.1.2006, 01:55 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 152
Регистрация: 22.3.2005

Репутация: нет
Всего: нет



12345c
Я видимо не совсем что-то понимаю, но width=100% для картинок у меня работает...
На разных расширениях экрана - фото разное. То есть если она изначально большая, то у меня сжимается на 800на600 и т.д., точнее отображается.
По сути дела я так понял все равно придется делать либо универсальную картинку под все расширения, либо для каждого свою картинку и свой MAP описывать... Муторно, о понимаю что правильно.
PM MAIL   Вверх
12345c
Дата 31.1.2006, 03:25 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Круглый
****


Профиль
Группа: Vingrad developer
Сообщений: 2018
Регистрация: 26.12.2005
Где: наша не пропадала ?

Репутация: 57
Всего: 101



Я лично не проверял - кто-то жаловался, что в каком-то браузере width=100% не работает.

Ах, там ещё map... сразу не уловил. Его тоже можно пересчитывать, он доступен как объект для JS. См. Объект Area. Расцветка весьма неудачная, но информация достаточная.

(Вы бы сразу правильно назвали тему, как я поправил, а то, думаю, никто до сих пор не понял, о чём была речь.)

Это сообщение отредактировал(а) 12345c - 31.1.2006, 12:51


--------------------
Google Code Playground - онлайн-отладка своих примеров HTML+JS без регистрации, с сохранением по URL, без кириллицы. Go
PM WWW   Вверх
dstorm81
Дата 31.1.2006, 10:26 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


бездельник
***


Профиль
Группа: Завсегдатай
Сообщений: 1178
Регистрация: 18.1.2006
Где: (16RU)

Репутация: 20
Всего: 39



имхо лучше все-таки две рисунки - две мапы сделать smile
тем более уменьшать большую картинку - по моему это сакс, смотреться хуже будет
хотя по мапу, ты вначале сделай из для разных разрешений, там имхо коеффициент заметить можно
koef=1024/800


--------------------
на форуме с 8.12.2002 (http://forum.vingrad.ru/index.php?act=ST&f=10&t=4874&st=0#)

PM   Вверх
rodendron
Дата 31.1.2006, 13:51 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 152
Регистрация: 22.3.2005

Репутация: нет
Всего: нет



Всем огромное спасибо. Много почвы для размышлений. Буду сейчас все обудмывать.
PM MAIL   Вверх
Sardar
Дата 4.2.2006, 13:43 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бегун
****


Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317



Можно забить на map'ы если отрабатываються не правильно, считать координаты самому. Указывать координаты областей на картинке "в процентах", т.е. [0-1], далее расчитывать положение мыши в тех же еденицах: event.(offset[X|Y] | layer[X|Y]) / img.offset[With|Height];

При этом сама картинка должна быть на релативной (position: relative) или абсолютной (position: absolute) позиции.


--------------------
 Опыт - сын ошибок трудных  © А. С. Пушкин
 Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
 Оценить мои качества можно тут.
PM   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
Форум для вопросов, которые имеются в справочниках, но их поиск вызвал затруднения, или для разработчика требуется совет или просьба отыскать ошибку. Напоминаем: 1) чётко формулируйте вопрос, 2) приведите пример того, что уже сделано, 3) укажите явно, нужен работающий пример или подсказка о том, где найти информацию.
 
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: Общие вопросы | Следующая тема »


 




[ Время генерации скрипта: 0.0481 ]   [ Использовано запросов: 22 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.