Autor Zpráva
Pavel_S
Profil *
Ahoj,
chtěl bych se zeptat jestli je možné pomocí CSS nastavit, že když najedu myší na nějaký element, tak aby to mělo nějaký účinek na jiný element.

Mám třeba takovýto kód:
<div>
<div id="d1">xxx xxx xxx xxx</div>
<div id="d2">aaa aaa aaa aaa</div>
</div>

A nyní bych chtěl, když myší najedu na element id="d1", změnit barvu pozadí u elementu id="d2". Jde to pomocí CSS nebo bych musel použít javascript?

Děkuji.
Manq
Profil
Pavel_S
Bez javascriptu to jde ve všech prohlížečích jenom pomocí <a>.

http://manq.ljt.cz/manq/blog/
menu
Taps
Profil
pomocí javascriptu by to šlo pomocí getElementById -> http://www.jakpsatweb.cz/dhtml.html Objekt document.getElementById()
Petroff
Profil
Pomocí css to jde u vnořených elementů (v moderních browserech lze použít i selektorů sourozence = to je právě tvůj případ)
Zkus tohle:
<html><head><title>HOVER</title>
<style>
div {float:left; width:100px; margin:1em; background:yellow}
div:hover+div {background:red}
</style>
</head>
<body>

<div>
BEGINUM dolor sit amet, consectetuer adipiscing elit.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Duis at felis a erat lobortis congue. Sed eget turpis.
Donec tempor mauris in ligula. Suspendisse ac dolor
ENDUS.
</div>
<div>
BEGINUM dolor sit amet, consectetuer adipiscing elit.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Duis at felis a erat lobortis congue. Sed eget turpis.
Donec tempor mauris in ligula. Suspendisse ac dolor
ENDUS.
</div>
<div>
BEGINUM dolor sit amet, consectetuer adipiscing elit.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Duis at felis a erat lobortis congue. Sed eget turpis.
Donec tempor mauris in ligula. Suspendisse ac dolor
ENDUS.
</div>
</body>
</html>
Manq
Profil
Petroff
Bohužel v IE <7 nepoužitelné.
Str4wberry
Profil
http://www.cssplay.co.uk/ — myslím, že najít tam řešení nebude problém…
Petroff
Profil
Není problém použít v IE6 vlastnost behavior a soubor csshover.htc , který emuluje pseudotřídu elem:over třídou elem.hover. Pak to půjde.
Použij: body{behavior:url(csshover.htc)}

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: