html/css kann ich bei hover bei einem Element ein anderes veränder?

...komplette Frage anzeigen

2 Antworten

.classname:hover ~ .classname {
    background-color: #F00;
}

Aber das funktioniert nur bei allen Geschwistern der Klasse die nach dem gehovertem Element kommen.

Ansonsten hilft nur Javascript:

var e = document.getElementsByClassName("classname");
var n = e.length;
function farbe(color) {
for(var i = 0; i < n; i ++) {
e[i].style.backgroundColor = color;
}
}
for(var i = 0; i < n; i ++) {
e[i].onmouseover = function() {
farbe("yellow");
};
e[i].onmouseout = function() {
farbe("black");
};
}

Das schreibt alle Elemente einer Klasse in ein Array, geht das durch und setzt die onmousover()-Funktion. Die wird dann aufgerufen wenn einer mit der Maus drüber fährt. Diese Funktion ist in dem Fall "farbe()". Und "farbe()" macht alle Elemente gelb.. bei mouseout(), also Maus runterbewegen, wird alles wieder schwarz gemacht.



Klassen können Geschwister haben? das wusste ich glaub cih noch nicht. kannst du kurz und knapp erklären wie das ist?

danke schonmal

0
@Zhalia

Alle Elemente der selben Klasse sind Geschwister. Vererbende oder abstrakte Klassen sind Eltern. Und Alle Klassen die etwas erben oder eine abstrakte Überklasse haben, sind Kinder.

Aber in CSS ist das net so dramatisch... war jetzt Exkurs in objektorientierte Programmierung :)

Also einfach alles was die gleiche Klasse hat...

0
@Elmo2999

achso okay ;)

mmh aber damti komm ich glaub cih nicht weiter ich guck nochmal.

weil das mit  dem Javascript sollen wir meine cih nicht benutzen.

ich schau mir das ncohmal mit der classe an vielleicht finde ich da ja einen weg. also vielen Danke

0
@Zhalia

Ich glaube nicht. Also, bin mir ziehmlich sicher.

Du könntest vielleicht, wenn du wirklich extrem drauf bist, das ganze "hover"-Zeug, also was reagieren soll in einer div den Hintergrund packen. Diese div reagiert dann komplett auf ein hover und dadrinne ordnest du alles so an wo es normal erscheinen soll und baust die Seite drüber mit absoluter Positionierung und/oder z-index.

Die Seite muss dann an den richtigen Stellen Löcher haben wo die zu hovernden Elemente von der div durchgucken um die Maus an den Stellen abzufangen. Die "Seite" kann ja teilweise tranzsparent sein, muss nur drüber liegen damit es nicht überall reagiert.

0

Du gehst in deine css Datei: Dort steht ja zum Beispiel sowas: div{ background-color: red; color: yellow; } Sagen wir du willst jetzt das beim Hovern der Hintergrund orange wird: Du schreibst dann darunter: div:hover{ background-color: orange; } Die Textfarbe (color) wird erhalten. Hoffe ich konnte helfen, lg EnderCookie

ja das sit mir klar, sowas hab cih ja schon drin.

die frage ist ob ich zum beispiel im "div1:hover{" sagen kann dass sich "div2" verändern soll.

trotzdem erstmal danke

0

sry das hatte ich überlesen. Tut mir leid, da weiß ich nicht weiter

0

Was möchtest Du wissen?