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

Beitrag lesen

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>