visibility ohne Platzhalter

[willson]

Hallo zusammen.

ich möchte ein Bild per Mausklick einblenden bzw. verstecken. So weit, so gut. Allerdings arbeitet die verwendete visibility-eigenschaft mit platzhalter - auch, wenn das bild nicht zu sehen ist. Wie kann ich das umgehen? Sicherlich mit "display". Aber display und ich stehen irgendwie auf Kriegsfuß ...

Dazu noch folgende Bemerkung: ich habe besagtes Bild per "position" positioniert. Der Bestimmungsort des Bildes ist jedenfalls nicht dort, wo ihn der kontinuierliche Ablauf in HTML einordnet. Das Problem: selbst "display" gibt den Platzhalter an genau der Stelle frei - oder halt nicht. Ich möchte das Bild nun am besten ohne jeglichen Platzhalter anzeigen, weil es sowieso (mittels z-index) oben auf liegt.

Kann mir jemand helfen?

Platzgehaltene Grüße.

[Michael S.]

Hallo,

wenn du verhindern willst das das Bild den normalen Element-Fluss beeinflusst probiere das Bild absolut zu positionieren, Beispiel:
<img src="bild.jpg" sytle="position:absolute; position-top:200px; position-left:200px; z-index:100;">

Ist die gewünschte Position keine fixe position, sondern relativ zu einem übergeordnetem Element, geht auch das, positioniere dann mit "position:relavtive;" anstelle von absolut. Genaueres hier: [url=http://de.selfhtml.org/navigation/css.htm#positionierung]Positionierung von Elementen[/url]

Gruss
Michael

[willson]

Hi Michael,

die Positionierung mit "absolute" hatte ich bereits ausprobiert. Das klappt zwar genauso, wie es soll aber ... das berühmt berüchtigte aber ... das einzublendene Bild soll den Hintergrund an einer bestimmten Position überdecken. Lege ich diese mit "absolute" fest, befindet es sich bei geänderter Größe des Browserfensters nicht mehr über der Stelle des Hintergrunds, über die es eigentlich soll (der Hintergrund ist über "margin: 0 auto" zentriert). Dieses Problem ließe sich mit "relative" hervorragend lösen, wenn, ja wenn die Sache mit dem Platzhalter nicht wäre (die bei "relative" ja auftritt).

Hast Du dazu noch eine andere Idee?

[Harlequin]

Yerf!

Dein Problem sollte sich mit absoluter Positionierung lösen lassen.

Wenn Du deinem zentrierten Block die Eigenschaft position:relativ gibst werden alle Kindelemente mit absoluter Positionierung an der linken oberen Ecke diese Blocks ausgerichtet.

Gruß,

Harlequin

[Michael S.]

Hi nochmal,

falls du das Problem nicht schon im Griff hast, schau die mal diese Seite an: http://meyerweb.com/eric/css/edge/complexspiral/demo.html
Da wird so etwas ähnliches gemacht, allerdings soll es mit dem IE6 noch nicht funktionieren.

Wenn ich das richtig verstehe musst du dein Bild *relativ* zum verschiebbaren Hintergrund positionieren so das das Bild immer über der gleichen Stelle des Hintergrundes liegt?
Böser Gedanke: mach 2 verschiedene Hintergrundgrafiken (eine mit dem Bild eingestempelt, einen ohne), lass das zusätzliche Bild weg und wechsele beim Klick einfach den Hintergrund aus, oder definiere zwei Layer im Hintergrund, und vertausche ihren z-index (damit beide grafik gleich geladen werden, kann man mit javascript sicher auch eleganter erledigen, ich kenn mich da nur sehr oberflächlich aus)

Gruss
Michael

[Willson]

@ Michael

ich war auf der Suche nach einer "stilvollen" Variante. Hatte mal 'nen Prof., der seine Lebensphilosophie offenbar recht erfolgreich hinterlassen hat.  ;)  Muß ich jetzt zum Psychater?

@ Harlequin

das funktioniert ja bestens!

Vielen Dank Euch beiden. Wünsch Euch ein schönes Wochenende!
ciao, Willson