не работает layer
Помогите новичку.
Нужно сделать следующее. На странице есть картинка. Когда кликаем мышкой, в этом месте на картинку накладывается другая. Хотел сделать с помощью слоев, но как понял layers не поддерживается ни Мозилой, ни IE. А надо чтобы работало под любым браузером. Подскажите пожалуйста, как можно это сделать. Спасибо. |
Если я правильно Вас понял, необходимо при клике на картинку, отображать n-ый div, с позиционированием, относительно клика. Если да, то вот основные этапы решения этой проблемки:
1. на онКлик картинки пишем функцию которая передаёт координаты указателя (абсолютные), 2. далее по ним выстраиваем координаты ДИВа 3. включаем видимость ДИВа 3. для body в стиль padding:0px; margin:0px; ОСТОРОЖНО: у ИЕ отклонение по относительной координате с оперой +1рх с файерфоксом -1рх (насколько я помню) Но пользоваться этим способом в крайнем случае... если накладываемая картинка не будет выходить за область ДИВа то может, есть смысл сделать кучу картинок и менять их в соответствии кликом на какую-либо область картинки. |
проблемы со слоями
Спасибо за ответ. Уточню задачу.
Есть одна большая картинка. Когда кликаем на ней, в том месте на нее накладывается другая - маленькая. Когда кликаем в другом месте, то и там тоже появляется та же картинка. То есть маленькая картинка "размножается". Копий может быть 100 и более. В соответствие с этим вопрос: можно ли динамически генерировать div-ы с картинками или придется заранее создавать 100 и более невидимых слоев и потом отображать их по мере необходимости ? И второй вопрос. Сейчас я сделал так: ....... #s3 {position: absolute; left: 50; top:50; padding:0px; margin:0px } #s4 {position: absolute; left: 50; top:50; padding:0px; margin:0px } ....... <div name="big_pic.png" id="s3"> <img src="smoll_pic.png"> </div> <div name="l2" id="s4"> <img src="bs.png"> </div> В Firefox 3.0.1 все ОК, левый верхний край картинок совпадает. А в ИЕ 7.0 вторая картинка смещена вниз на 5 пикселей. Может я что-то не так сделал или это особенность ИЕ ? Можно ли как то сделать универсально или придется подстраиваться под каждый браузер (а может и их разные версии) ? |
Ответ 1: да дивы можно генерировать по ходу выполнения скрипта. Для этой цели служит такая вещь как "DOM"- Document Object Model. Наберите запросы в поисковике, и там найдётся множество статей с подобными задачами.
Ответ на второй вопрос: а вы не забыли для body в стиль "padding:0px; margin:0px;" прописать? Обычно, если есть такого рода смещения, то вызвано это этими свойствами. Также можете все дивы, вместе с рисунком вставить в ячейку таблицы. Я сам не гений javascript, но четко заню, что идеального совпадения во всех браузерах добиться очень тяжело. |
Часовой пояс GMT +3, время: 18:40. |