Перед тем как ломать голову самой, хочу разузнать, может где-то есть уже подобная задача:
на странице лежат три образца цвета в виде закрашенных квадратов, слева лежит штук 20 дверей разных видов, в один из трех цветов они все закрашены уже по умолчанию, требуется чтобы человек мог взять один из цветов, навести его на любую дверь и дверь должна покраситься в соответствующий цвет. В общем-то вот и вся задача, дело так понимаю рук JS.
 

Думаю самым разумным будет отфотошопить все 3 цвета для каждой двери и  просто подменивать src у картинок при нажатии.

Можно конечно накладывать цветной прозрачный div на дверь при условии, что дверь имеет форму прямоугольника, но хорошего качества врядли этим можно добиться.

Хотя всё зависит от "серьёзности" проекта. 

Я, пожалуй, не правильно изъяснилась, отфотошопить заранее все три варианта двери и подразумевалось. Требуется алгоритм (или самой придется учиться-мучиться;)), который бы реализовывал такое действие: 
пользователь берет одну из трех текстур, наводит на любую понравившуюся дверь и она "красится", т.е. заменяется другой фотошоповской дверью, соответствующей выбранной текстуре. 

yalo, браузер не может рисовать (о canvas поговорим больше когда руки дойдут изучить). Как вариант сделать полупрозрачную картинку двери, сохранить в PNG, менять цвет заднего фона (либо заливать текстурой), всё что прозрачно будет "закрашиваться". Сохранять лучше в PNG, т.к. есть градиентная прозрачность в отличии от GIF. 

т.е. JS не может определить объект1, над которым находится другой объект2 и ПРОСТО ЕГО (объект1) ПОМЕНЯТЬ на другую картинку (т.е. на другую дверь)? 


разве замена одного изображения на другое является рисованием? 

Это сообщение отредактировал(а) yalo - 25.7.2006, 11:43

обязателен драг анд дроп
а так просто
e=e||window.event
i=e.target||e.srcElement
document.getElementById('mylovelyDoor').src=i.src;
вроде так
 

yalo, может конечно, как говорилось выше смена аттрибута src у картинки. Я предлагал "закраску" обьектов "с помощью JS". 

yalo, Вы, наверное, немного не в тот раздел написали. Если бы вопрос был в разделе "Для начинающих", Вам бы попытались объяснить или написать алгоритм, а в общем разделе "Javascript" даже мысли ни у кого не возникло, что проблемы с алгоритмом и процедурами реализации. Перенести тему туда?

Реализуется на том же, что и таскание объектов (слоёв) по окну - http://js2.ru/example/JsPrimeryCode-56.htm . Потом определяется точка отпускания, сравнивается с точкой расположения целевых объектов.   

Это сообщение отредактировал(а) 12345c - 3.3.2008, 14:45

если возможно, то перенесите, пожалуйста, прошу прощения за невнимательность - где увидела слово JS, туда и ломанулась не глядя   

Перенёс. Если я правильно понял уровень Ваших затруднений.

yalo, извиняться тут не за что.
Из необъяснённого тут осталась одна нетривиальная вещь - как определить, что мышь отпущена над целевой картинкой. Вам нужно получить координаты угла каждой целевой картинки в документе - document.getElementById('...').offsetTop, ..., размеры её, и проверить условие попадания координат мыши в момент onmouseout в один из целевых прямоугольников. Справитесь? 

буду стараться... надо начать писать, а там начну спрашивать конкретнее... сегодня 

написан такой код


застопорилась на определении местоположения дверей, не срабатывает  
doorsPos[i]=document.getElementById('door'+i).offsetTop в функции doorPos()    
 

yalo, потому что пытаешся ты выбрать элементы до того как они определены, поставь вызов после вёрстки, либо повесь на body.onload. Также ты пытаешся выбрать 20 элементов, у тебя их 4, следовательно на пятом null и исключение.

Лучше верстать структурно:



Сами скрипты написанны не очень, только под ИЕ.    

ок, дверей поставлено сколько нужно, т.е. 20 штук, код исправлен на 

функция определения объектов приняла вид


что дальше? как отпустить мышь и назначить после этого 2 взаимоисключающих расклада вещей:
1) если плашка над какой-то дверью, то она заменяется на дверь цвета плашки, а плашка возвращается на свое  место
или
2) если плашка не была ни над какой дверью, значит при отпускании мыши возвращается на место
Хоть наметки? подскажите, пожалуйства!