[UPD] Если области "подсветки" не пересекаются в прямоугольных...17.04.09 09:21 Число просмотров: 3303 Автор: Heller <Heller> Статус: Elderman Отредактировано 17.04.09 11:21 Количество правок: 1
> Ну и кликать надо по ним для изменения их состояния, да. > Нарезай, HandleX, png-шки, нарезай, не отвлекайся ;-) Если области "подсветки" не пересекаются в прямоугольных областях, то можно обойтись всего двумя png-шками (если пересекаются, то придется сложнее, но в принципе все равно можно сократить затраты способом ниже).
Первая png-шка - подложка в неселектированном состоянии. Вторая - оно же, где все посадочные места селектированы одновременно. При необходимости javascript-ом можно менять для второй png-шки свойства clip и позиционирование, так, чтобы оставалась видимой только та часть картинки, что селектирована.
Ну а вообще для твоей задачи наверное лучше подошел бы flash, хоть это и плохо.
----------------
[UPD] Вообще подумалось, что если требуется только подсветка отдельных областей какой-то конкретной геометрической формы (или нескольких форм), то можно позиционировать полупрозрачную png-шку поверх основной картинки просто javascript, обрабатывая координаты мыши. К этой png-шке уже вполне можно будет применить любые свойства при необходимости.
И желательно, чтобы оно было полупрозрачное, дабы видеть, что под картинкой.
Если нельзя, то мож есть ещё какие-то варианты, pls...
Зачем всё это? Ну, динамически отображать области на картинке в соотв. с легендой и текущим состоянием, при этом чтобы была возможность тыркать мышой по этим областям. Поэтому охота цвет и полупрозрачность именно элемента <AREA>.
Заранее всем ОГРОМНОЕ спасибо за ответы.
Тебе нужно именно или другие варианты тоже подойдут?17.04.09 03:16 Автор: Den <Денис Т.> Статус: The Elderman
Надо отобразить схему зала сложной формы с тысячами посадочных мест и их состояние в соотв. с цветной легендой.17.04.09 07:48 Автор: HandleX <Александр М.> Статус: The Elderman
Ну и кликать надо по ним для изменения их состояния, да.
Нарезай, HandleX, png-шки, нарезай, не отвлекайся ;-)
А зачем вручную нарезать то, что можно сделать автоматически? [upd]17.04.09 21:57 Автор: amirul <Serge> Статус: The Elderman Отредактировано 17.04.09 21:59 Количество правок: 1
> Ну и кликать надо по ним для изменения их состояния, да. > Нарезай, HandleX, png-шки, нарезай, не отвлекайся ;-) area твоя - это обычная xml-ка, какой нибудь gdi+ в руки и за часик можно набросать тулзу, которая все нарисует и сохранит
------------
Хотя согласен с предыдущими ораторами - flash/silverlight гораздо лучше подходят для таких вещей, чем аяксы.
ИМХО, самое лучшее решение - Adobe Flash17.04.09 11:24 Автор: Den <Денис Т.> Статус: The Elderman
[UPD] Если области "подсветки" не пересекаются в прямоугольных...17.04.09 09:21 Автор: Heller <Heller> Статус: Elderman Отредактировано 17.04.09 11:21 Количество правок: 1
> Ну и кликать надо по ним для изменения их состояния, да. > Нарезай, HandleX, png-шки, нарезай, не отвлекайся ;-) Если области "подсветки" не пересекаются в прямоугольных областях, то можно обойтись всего двумя png-шками (если пересекаются, то придется сложнее, но в принципе все равно можно сократить затраты способом ниже).
Первая png-шка - подложка в неселектированном состоянии. Вторая - оно же, где все посадочные места селектированы одновременно. При необходимости javascript-ом можно менять для второй png-шки свойства clip и позиционирование, так, чтобы оставалась видимой только та часть картинки, что селектирована.
Ну а вообще для твоей задачи наверное лучше подошел бы flash, хоть это и плохо.
----------------
[UPD] Вообще подумалось, что если требуется только подсветка отдельных областей какой-то конкретной геометрической формы (или нескольких форм), то можно позиционировать полупрозрачную png-шку поверх основной картинки просто javascript, обрабатывая координаты мыши. К этой png-шке уже вполне можно будет применить любые свойства при необходимости.
Сомневаюсь, что это возможно стандартными средствами16.04.09 16:20 Автор: Heller <Heller> Статус: Elderman
Все свойства CSS применимы лишь к CSS-боксам, а тег AREA CSS-боксом не является.
Плохое решение: грузить несколько картинок, и по onmouseover-у на area менять их на нужные.
Вообще сейчас HTML-мэпы прктически не используются, насколько мне известно. С учетом возможностей позиционирования CSS-боксов, проще грузить просто несколько картинок, которых явным позиционированием накладывать друг на друга, а все свойства отображения применять уже к этим отдельным картинкам, а не к area. Этот подход весьма гибок и используется практически на любом сайте с резиновой раскладкой.
Я не знаю насколько это поддерживается современными браузерами, но можно так же посмотреть в сторону SVG и тега CANVAS.
Очнь жаль, что это _невозможно_ через area :-(17.04.09 07:40 Автор: HandleX <Александр М.> Статус: The Elderman
> Вообще сейчас HTML-мэпы прктически не используются, > насколько мне известно. С учетом возможностей > позиционирования CSS-боксов, проще грузить просто несколько > картинок, которых явным позиционированием накладывать друг > на друга, а все свойства отображения применять уже к этим > отдельным картинкам, а не к area. Этот подход весьма гибок > и используется практически на любом сайте с резиновой > раскладкой. Проще, ага... Сколько геморроя можно избежать, навернув возможности <area> до CSS бокса, дык нет же, автогеном... через #опу ;-)
> Я не знаю насколько это поддерживается современными > браузерами, но можно так же посмотреть в сторону SVG и тега > CANVAS. Тож не выход, потому что нужна безгеморройная поддержка в IE (без запаривания пользователя установкой ActiveX плугинов).
Ладно, буду думать... Пока не сильно это важно, потому что ту схему, которую охота вот так вот круто отобразить пока возможно реализовать таблицей... Но вот потом будут схемы, где без графики не обойтись... Буду долго думать, короче...