✔ Hoverbild und normale Links

[starfoxfs]

Hi zusammen,

Ich habe auf einem Bild ein Div Layer der mir bei on Hover und Active ein Hintergrundbild anzeigt sozusagen als Effekt.

Nun das Problem das Hintergrundbild von a:active , a:focus wird mir nun aber auch auf den normalen links angezeigt wenn sie active sind.

.sidebar a {
display: block;
width: 110px;
height: 90px;
margin-top: 15px;	
}

.sidebar a:active, a:focus {
display: block;
width: 110px;
height: 90px;
margin-top: 15px;
background: url(../images/sidebaractive.png);
}

.sidebar a:hover {
display: block;
width: 110px;
height: 90px;
margin-top: 15px;
background: url(../images/sidebarhover.png);
}

 

[Maik]

Hi,

dann spezifizier die Regel ausschließlich für diesen Link mittels eines ID-Bezeichners - also beispielsweise:

<div class="sidebar">
   <a href="#" id="bgImage">Link mit Hintergrundbild</a>
   <a href="#">Link ohne Hintergrundbild</a>
</div>

.sidebar a#bgImage:hover {
background: url(../images/sidebarhover.png);
}
.sidebar a#bgImage:active, .sidebar a#bgImage:focus {
background: url(../images/sidebaractive.png);
}

Die drei Pseudoklassen hast du in der falschen Reihenfolge genannt, und bei :focus das Elternelement .sidebar vergessen.

mfg Maik

 

[starfoxfs]

Jo hat funktioniert vielen Dank ;-)