So ändern Sie NUR den Inhalt von Bild 1, wenn sich Bild 2 ODER Bild 1 im Hover befindet ⇐ CSS

[Anonymous]

Was ich tun möchte, ist, dass, wenn Sie mit der Maus über fahren, der Inhalt von geändert wird. Wie Sie sehen, habe ich das mit dem Textfeld selbst gemacht, jetzt möchte ich, dass es auch passiert, wenn ich den Mauszeiger über den Computer bewege.

Code: Select all

[img] [/img]

[img]https://file.garden/aG3rdTNO_Dlar7-g/new%20site/landing/welcome%20text%20box.png[/img]

Code: Select all

.computer{
position:absolute;
width:350px;
height:419px;
left:1535px;
top:660px;
}

.text{
position:absolute;
left:1570px;
top:455px;
}

.text:hover{
width: 318px;
height:185px;
content: url("https://file.garden/aG3rdTNO_Dlar7-g/new%20site/landing/home%20text.png");
transition-delay:3s;
}

Verschiedene Dinge, die ich ausprobiert habe, und ihre Ergebnisse:
Ich habe das auch mit dem Komma und dem Pluszeichen versucht und nichts bekommen

Code: Select all

.welcome:hover .computer:hover{
width: 318px;
height:185px;
content: url("https://file.garden/aG3rdTNO_Dlar7-g/new%20site/landing/home%20text.png");
transition-delay:3s;
}

Den neuen Inhalt zu einer eigenen Sache machen, auch nichts

Code: Select all

.text{
position:absolute;
left:1570px;
top:455px;
z-index: -1
}

.home{
display:none;
}

.computer:hover .home{
display:block;
z-index: 1;
transition-delay:2s;
left:1570px;
top:455px;
position:absolute;
}

Das, was mir am nächsten kommt, ist dieses

Code: Select all

[url=index.html]
[img]https://file.garden/aG3rdTNO_Dlar7-g/new%20site/landing/computer.png[/img]
[/url]

[img]https://file.garden/aG3rdTNO_Dlar7-g/new%20site/landing/welcome%20text%20box.png[/img]

#home:hover {
width: 318px;
height:185px;
content: url("https://file.garden/aG3rdTNO_Dlar7-g/new%20site/landing/home%20text.png");
transition-delay:3s;
}

Aber das hat den Inhalt des Computers verändert, und ich möchte nur den Textinhalt ändern.