Дублирование выделения при наведении мыши

[SuperBatya]

Нашел схожий сайт: http://азимут.бел/klientu/

1. Подскажите кто сможет, как сделать меню, как в разделе "КАК ВЫБРАТЬ ДВЕРЬ"
2. Как сделать дублирование выделения объектов, как в разделе "КОНСТРУКЦИЯ ДВЕРЕЙ"

[spoon]

По пункту 2 это просто копия т.е. ставишь событие на наведение (hover) на цыфру и копируешь.

[voron]

первое тоже на событиях (очистить-показать)

[SuperBatya]

spoon, это понятно, беру shape, ставлю hover... Но как сделать, что бы дублировалось выделение на других элементах: текста и shape

[voron]

вот как то так

[spoon]

как то так, с текстом особо не парился, может сам посмотришь.

[voron]

А :hover на андройде работает? слышал там проблемы с этим псевдокласом

[spoon]

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

[SuperBatya]

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

И еще, как их разделять по группам, пробовал, что то не выходит - выделяются все!!!

[spoon]

Выделяются все так как class один у группы, надо каждой группе свой class прописывать. Но вообще лучше через html-свойство делать(текст и фигуры) и там задавать css настройки или через js.
Касаемо текста запарка вышла)) думаю через билдер не выйдет только через html-свойство прописывать все. Может Кирилл подскажет как).
Может все это дело можно и силами билдера, не прописывать class и тому подобное, но я не нашел)))

[SuperBatya]

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

[spoon]

Покавыряюсь, посмотрю попозжя)

[Gudwinn]

Вот посмотрите накидал схематичный пример http://dver-primer.offershop.ru Сделал свои обработчики для событий, если есть небольшое понимание кода, я думаю разобраться совсем не сложно Вот скрипт

Код: Выделить всё

<script>

$('.class1').mouseover(function (){
$('#Shape1,#Shape4').css('background','#800080');
$('#wb_Text1 span').css('color','#800080');
});

$('.class1').mouseout(function (){
$('#Shape1,#Shape4').css('background','#560080');
$('#wb_Text1 span').css('color','#560080');
});

//ниже для второго слоя
$('.class2').mouseover(function (){
$('#Shape2,#Shape5').css('background','#800080');
$('#wb_Text2 span').css('color','#800080');
});

$('.class2').mouseout(function (){
$('#Shape2,#Shape5').css('background','#560080');
$('#wb_Text2 span').css('color','#560080');
});

//ниже для третьего слоя
$('.class3').mouseover(function (){
$('#Shape3,#Shape6').css('background','#800080');
$('#wb_Text3 span').css('color','#800080');
});

$('.class3').mouseout(function (){
$('#Shape3,#Shape6').css('background','#560080');
$('#wb_Text3 span').css('color','#560080');
});



</script>

[SuperBatya]

Кирилл, в примере у тебя все тип-топ!!! Но может закинешь исходник, а то все делаю вроде бы как надо, но не получается...
Выкладываю исходник...

[Gudwinn]

Держите исходник

dver-primer.zip

[SuperBatya]

Кирилл, большое тебе спасибо! Все работает на ура!!!

Да и всем, кто участвует в дебатах, большое спасибо!

[spoon]

На css jsfiddle.net