Sven: eine Lösung: Positionierung dyn. Buttons mit css

Ich habe eine Lösung um dyn. Buttons mit css zu positionieren. Dabei ist folgendes zu beachten, fuer Netscape stellt ein Layer innerhalb einer Div-Umgebung ein Layer in einem Layer dar, d.h. Div ist selber ein Layer (glaube, das ist nur notwendig, wenn man im Div-tag STYLE="Position: ... verwendet ). Das beste wird sein ich schreibe den HTML-Code hinein:

<HTML>
<HEAD>
   <TITLE>Dynamische grafische Buttons</TITLE>

<SCRIPT LANGUAGE="JavaScript">
    <!--
    Normal1 = new Image();
    Normal1.src = "xavista1.jpg";
    Highlight1 = new Image();
    Highlight1.src = "xavista2.jpg";

Normal2 = new Image();
    Normal2.src = "xlycos1.jpg";
    Highlight2 = new Image();
    Highlight2.src = "xlycos2.jpg";

function Bildwechsel ( BildName, BildObjekt ) {
      if ( document.all ) {
        switch ( BildName ) {
          case 'AltaVista' : window.document.all.AltaVista.src = BildObjekt.src;
                             break;
          case 'Lycos' :     window.document.all.Lycos.src = BildObjekt.src;
                             break;
        }
      }
      else {
        if ( document.layers ) {
          switch ( BildName ) {
            case 'AltaVista' : window.document.DIV0.document.LAYER0.document.AltaVista.src = BildObjekt.src;
                               break;
            case 'Lycos' :     window.document.DIV0.document.LAYER0.document.Lycos.src = BildObjekt.src;
                               break;
          }
        }
      }
    }
    //-->
</SCRIPT>

<STYLE TYPE="text/css">
    <!--
    DIV.POS {
      POSITION:absolute; TOP:100px; LEFT:100px; WIDTH:100px;
    }
    //-->
  </STYLE>
</HEAD>

<BODY TEXT="#000000" BGCOLOR="#FFFFFF">

<DIV CLASS="POS" ID="DIV0">
  <LAYER ID="LAYER0">
    <A HREF="http://www.altavista.digital.com/"
      onMouseOver="Bildwechsel ( 'AltaVista', Highlight1 )"
      onMouseOut="Bildwechsel ( 'AltaVista', Normal1 )">
      <IMG SRC="xavista1.jpg" NAME="AltaVista" ALT="AltaVista besuchen" BORDER=0 HEIGHT=99 WIDTH=186></A><BR>
    <A HREF="http://www.lycos.de/"
      onMouseOver="Bildwechsel ( 'Lycos', Highlight2 )"
      onMouseOut="Bildwechsel ( 'Lycos', Normal2 )">
      <IMG SRC="xlycos1.jpg" NAME="Lycos" ALT="Lycos besuchen" BORDER=0 HEIGHT=99 WIDTH=186></A>
  </LAYER>
</DIV>

</BODY>
</HTML>

  1. Hallo Sven,

    vielen Dank fuer das Posten des Beispiels - ist doch mal was anderes als eine Frage ;-)

    Viele Gruesse
      Stefan Muenz

  2. Das Layer-Tag scheint sogar noch ueberfluessig zu sein, den anscheinend interpretiert Netscape sobald im Div-Tag die Styleangabe Position kommt dieses automatisch als Layer und man kann dieses direkt als Layer ansprechen.