|
|
Регистрация Восстановить пароль |
Регистрация | Задать вопрос |
Заплачу за решение |
Новые сообщения |
Сообщения за день |
Расширенный поиск |
Правила |
Всё прочитано |
|
Опции темы | Поиск в этой теме |
01.02.2016, 20:14 | #1 |
Регистрация: 26.01.2016
Сообщений: 4
|
Менять цвет второго элемента при наведении на первый и наоборот
Задача: есть два блока div1 - black, div2 - gray. Если наводим на div1 , то div2 становится голубым, eсли наводим на div2 , то div1 становится красным,
Это делается без js. Долго мучаюсь,не могу вспомнить, как это делал, а исходники потерях. Код HTML:
<html> <head> <style> .div1{width: 100px; height: 200px; background: black;} .div2{width: 100px; height: 200px; background: gray;} </style> </head> <body> <div class="div1 "></div> <div class="div2 "></div> </body> </html> Буду очень признателен за вашу креативность. Последний раз редактировалось Вадим Мошев; 09.05.2016 в 22:05. |
01.02.2016, 21:46 | #2 |
Старожил
Регистрация: 12.11.2010
Сообщений: 8,568
|
Хорошая задача. Заставляет немного поломать мозги.
Вот то, что у меня получилось. Быть может, это и быдлокод, но работает. (протестировать можно по этой ссылке: https://jsfiddle.net/vdszfpbu/) Код HTML:
<!DOCTYPE html> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <html> <head> <title></title> <style> #main { height: 400px; border: 1px solid black; position: relative; } div {margin: 10px;} /*просто отступ, для понятности, на самом деле он не нужен*/ #div1, #div2, #colorForDiv1 { width: 100px; height: 100px; } #div1 { background-color: black; } #div2 { background-color: gray; } #colorForDiv1 { position: absolute; left: 0; top: 0; display: none; background-color: blue; } #div1:hover + div { background-color: red; } #div2:hover #colorForDiv1 { display: block; } </style> </head> <body> <div id="main"> <div id="div1"></div> <div id="div2"> <div id="colorForDiv1"></div> </div> </div> </body> </html> Последний раз редактировалось Вадим Мошев; 01.02.2016 в 21:48. |
03.02.2016, 19:03 | #3 |
Раздолбайских Дел
Старожил
Регистрация: 22.05.2009
Сообщений: 3,828
|
Alar, верни репу!
|
Похожие темы | ||||
Тема | Автор | Раздел | Ответов | Последнее сообщение |
Замена фона элемента при наведении курсора | ardor | C# (си шарп) | 1 | 03.10.2013 23:52 |
var Key Press Delphi - при нажатии на клавиши менять цвет формы | Grimnir | Помощь студентам | 6 | 29.03.2013 12:00 |
как менять ссылку при наведении на не курсором? | Luca Brasi | HTML и CSS | 3 | 29.12.2012 23:13 |
Прорисовка элемента только при наведении курсора | Crystallon | Общие вопросы Delphi | 3 | 15.05.2011 16:45 |
Изменить цвет ссылок при наведении | Gatti | HTML и CSS | 1 | 01.10.2009 23:08 |