Willkommen in der Webstatt Zum Webstatt Blog und Stories
Al3x0r Al3x0r am 21.08.06 06:52

Guten Morgen,

Es ist sicher Etwas ganz banales aber ich kriege einfach keine zufriedenstellende Lösung.

Also folgendes Szenario:

Ich habe mehrere Textlinks und daneben eine Box. In dieser Box soll je nachdem über welchen Textlink ich fahre ein anderes Bild angezeigt werden.
Die Position des Bildes ist immer die gleiche, es ändert sich lediglich das Bild.

Ist das irgenwie mit CSS zu realisieren ? Ich kriegs einfach nicht hin.

mfg Alex

netcup.de Warum gibt es hier Werbung?
milahu milahu am 21.08.06 12:03

Nope. Dazu müsste man mit CSS auf Elternelemente zugreifen können.. :-\

Al3x0r Al3x0r am 21.08.06 15:37

Quote
Original von milahu
Nope. Dazu müsste man mit CSS auf Elternelemente zugreifen können.. :-\


Hilft also nur Javascript?

Scraper Scraper am 21.08.06 16:21

Naja, das würde ich nicht sagen. Man könnte beispielsweise einfach 2 Grafiken machen, einmal Textlink mit weißer Fläche und einmal mit Grafik daneben. Nachteil: Es sind keine Textlinks mehr.

Oder man macht eine Unordered List und formatiert die Aufzählungspunkte mit Grafiken bei hover.

tranver am 21.08.06 18:44

hi,

suchst du vll. sowas:
Beispiel #2

Hier der Link zu Erklärung: selfhtml


cu
bobby

Al3x0r Al3x0r am 21.08.06 18:53

Jaein... Habe das auch schon vorher gefunden aber das sagt mir auch nicht zu.

Ich habe ein feste Position von einem Bild , darum verteilt sind Links. Bei einem Linkhover soll dann das dem Link entsprechende Bild angezeigt werden..

mfg Alex

milahu milahu am 21.08.06 21:11

Hab's nu doch fertig gebracht -- overflow ist das Zauberwort! :)

<html>
<head>
<style type="text/css">
ul{padding-left:250px}
ul li{height:2em;overflow:visible}
ul img{display:none}
ul a:hover+img{display:block}
#li1 a:hover+img{margin:-2em 0 0 -250px}
#li2 a:hover+img{margin:-4em 0 0 -250px}
</style>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<ul>
<li id="li1">
<a href="#">#li1</a>
<img src="bild1" />
</li>
<li id="li2">
<a href="#">#li2</a>
<img src="bild2" />
</li>
</ul>
</body>
</html>

Creative Commons Lizenzvertrag
Alle Inhalte des Webstatt-Archivs stehen unter einer Creative Commons Namensnennung - Weitergabe unter gleichen Bedingungen 3.0 Unported Lizenz.

Impressum & Kontakt