Tabelle und layer: position.relative

[Vermeer]

Hi,
ich möchte in einer Zabellezelle ein Bild setzen, und über dieses Bild ein zweites Bild (transparentes gif).

<table border=0 cellspacing=0 cellpadding=0>
  <tr>
   <td><a href="#"><img src="....jpg" width=46 height=46 border="0" alt=""></a><div id="blabla" style="position:relative; z-index:1; left: 0px; top: -46px; visibility: visible;"><img src="images/blabla.gif" border="0" alt="" width="46" height="46"></div>
  </tr>
</table>

Das Bild im layer wird auch schön über das andere gelegt, ABER:
Die Tabellenzelle wird auf einmal doppelt so hoch! Wieso, der Layer liegt doch nicht unter dem Bild, sondern direkt drauf?
Wer hat eine Lösung?
Danke im Vorraus.
Vermeer

[Ingo Turski]

Hi,

ich möchte in einer Zabellezelle ein Bild setzen, und über dieses Bild ein zweites Bild (transparentes gif).

und warum definierst Du das nicht transparente Bild nicht einfach als Hintergrundbild?

freundliche Grüße
Ingo

[Vermeer]

Stimmt, gute Idee. Mit hintergrundbild müsste es gehen.
Ich will übrigens nicht irgendwie "Bildklau" verhindert.
Ist klar dass das nicht geht.
Ich will einfach einen simplen onmouse-over-effekt: Nur bei onmouseover soll das erste bild nicht ersetzt werden, sondern ein zweites hinzukommen.

Gruß
Vermeer

Hi,

ich möchte in einer Zabellezelle ein Bild setzen, und über dieses Bild ein zweites Bild (transparentes gif).
und warum definierst Du das nicht transparente Bild nicht einfach als Hintergrundbild?

freundliche Grüße
Ingo

[Ingo Turski]

Hi,

Ich will einfach einen simplen onmouse-over-effekt: Nur bei onmouseover soll das erste bild nicht ersetzt werden, sondern ein zweites hinzukommen.

dazu würde ich beide Bilder als Hintergrund definieren. Das erste als Hintergrund für TD und das zweite als Hintergrund für a:hover. Der Vorteil ist, daß es über CSS durch Auslagerung Code einspart und ohne Javascript funktioniert.

freundliche Grüße
Ingo

[MudGuard]

Hi,

<table border=0 cellspacing=0 cellpadding=0>
  <tr>
   <td><a href="#"><img src="....jpg" width=46 height=46 border="0" alt=""></a><div id="blabla" style="position:relative; z-index:1; left: 0px; top: -46px; visibility: visible;"><img src="images/blabla.gif" border="0" alt="" width="46" height="46"></div>
  </tr>
</table>
Das Bild im layer wird auch schön über das andere gelegt, ABER:
Die Tabellenzelle wird auf einmal doppelt so hoch! Wieso, der Layer liegt doch nicht unter dem Bild, sondern direkt drauf?

So ist relative definiert:

relative
    The box's position is calculated according to the normal flow (this is called the position in normal flow). Then the box is offset relative to its normal position. When a box B is relatively positioned, the position of the following box is calculated as though B were not offset.

Der letzte Satz sagt es aus.

Wer hat eine Lösung?

Ich weiß ja nicht, was der Zweck der Operation sein soll? Bildklau verhindern? ==> Screenshot, schon hat man das Bild.

Ggf. das eigentliche Bild als Hintergrundbild des transparenten Bilds einbinden? (Hilft aber auch nicht gegen Bildklau)

cu,
Andreas

[chlori]

Hi

ich möchte in einer Zabellezelle ein Bild setzen, und
über dieses Bild ein zweites Bild (transparentes gif).

Warum? Ist das ein billiger Versuch das Bild zu schützen?

Das Bild im layer wird auch schön über das andere gelegt,

"Layer" ist ein verwirrender Ausdruck. Einige meinen damit
den <layer> Tag (Netscape alt), andere meinen ein Div (Wieso
nicht Div sagen, wenn man Div meint?) und wieder andere
meinen ein absolut positioniertes Div...

Die Tabellenzelle wird auf einmal doppelt so hoch!

Natürlich, du hast ja das relativ positionierte Div nach
oben verschoben, aber der vorhergesehene Platz bleibt frei.

Wenn du eine saubere Lösung willst:
Missbrauche Tabellen nicht für das Layout. Benutze CSS
dafür.

Gruss
chlori