Ermittlung/Wechsel von className's

[Gunnar Bittersmann]

@@Enrico:

nuqneH

ich verwende eigene Grafiken für die Darstellung von Checkboxen, damit sie zum Design unserer Homepage passen.

Das kannst du gerne tun. Du solltest aber NICHT 'div' anstelle von Checkboxen verwenden! Ansonsten baust du eine Barriere ein und machst deine Seite unzugänglich.

Du kannst die vorhandenen Checkboxen aus dem Viewport schieben und dem 'label' je nach Status der Checkbox verschiedene Hintergrundgrafiken verpassen. (Oder dieselbe, aber verschiedene Ausschnitte daraus (CSS-Sprites).)

Markup (ansatzweise):

<input type="checkbox" name="foo" id="foo"/>  
<label for="foo">Lorem ipsum</label>

Stylesheet:

[type="checkbox"]  
{  
  position: absolute;  
  left: -9999px; /* für RTL-Schriften: right */  
}  
  
[type="checkbox"]+label  
{  
  background: url(checkbox-not-checked.png) no-repeat;  
  padding-left: 42px;  
}  
  
[type="checkbox"]:checked+label  
{  
  background: url(checkbox-checked.png) no-repeat;  
}

Du brauchst nur noch einen Fallback für Browser, welche die Pseudoklasse :checked nicht verstehen. Dieser kann so aussehen, dass du in dem Fall die normalen Checkboxen verwendest.

Vorteil: Keine Barriere; kein JavaScript erforderlich.

Qapla'