CSS mehrfach Hover-Effekt
 

Hallo Leute,

heute brauch ich mal Hilfe :D

Folgendes habe ich vor:

Ich erstelle einen Wochenkalender, dessen Termine aus Boxen bestehen.
Einige Aktivitäten Wiederholen sich an verschiedenen Tagen.
Es soll nun so sein, dass der User alle gleichen Aktivitäten farblich hervorheben, sodass er gleiche Aktivitäten auf einen Blick identifizieren kann.

Das ganze soll ohne JavaS***** ablaufen. Ich dachte ich gebe gleichen Aktivitäten einfach die selbe CSS Klasse und kann sie via hover-Effekt sichtbar machen. Leider funktioniert das nicht, es wird nur das "aktive" einzelne Element gehovert.

Das muss doch mit CSS gehen... :unibrow:

Ich glaube du kommst um JavaS***** hier nicht rum.

1. Du solltest mal dazu schreiben, was und wie Du es umsetzt. Du machst was mit CSS...aha...JSF, ASP, JavaFX, HTML? CSS 3?

2. Das was Du vorhast kann man auch nur mit CSS 3 hinbekommen. Kommt aber ganz drauf an.

Ab hier kann ich nur raten...

Perdon, hab vergessen zu schreiben, dass es nur ein Mix aus HTML5 und CSS 3 sein soll.
Keinerlei S*****sprachen o.ä.

Das sollte mit CSS3 gehen. Ohne die Struktur oder das Markup zu kennen, sehe ich keine Möglichkeit dir helfen zu können. Eine Allgemeinlösung gibt es da nicht.

Meinst Du [Link nur für registrierte und freigeschaltete Mitglieder sichtbar. Jetzt registrieren...]?

Wenn Du eine bessere Antwort brauchst, dann siehe Antwort von NetWebs

danke weberleins, danach habe ich glaube ich gesucht. Ich werde das am Wochenende ausprobieren.
Naja Mock würde so aussehen:

.box1{position:relative;
height:250px;
width:250px;
background-color:green;}

.box2{position:relative;
height:250px;
width:250px;
background-color:blue;}

.box1:hover{
background-color:red;}

.box2:hover{
background-color:red;}


HTML:

...
<div class="box1">Aktivität X</div>
<div class="box2">Aktivität Y</div>
<div class="box1">Aktivtät X</div>

...


Sobald mal über ein box1 Element mit dem Zeiger fährt soll nicht nur die eine aktive box1 hovern, sondern alle box1 Elemente auf der Seite.

Ich glaube ohne JS ist da nichts zu machen bei nur 2 Boxen ist das wohl mit CSS machbar aber bei 3 oder mehr, wie soll das mit CSS zu realiseren sein? Zumal ich denke das als Llayout eine Art Tabelle mit mehreren Spalten genutzt wird um die Termine darzustellen.

@sigon

Thread lesen... dann antworten...
Das geht, kommt aber aufs Markup an.