kingofrap: Ausklappbares Menü mit CSS

Hallo allerseits,

ich habe mir eine Seite gebastelt:

Code von index.php:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>WP-Informatik</title>
<link href="style.css" rel="stylesheet" type="text/css" />

</head>

<body text="#666666">

<p>&nbsp;</p>
<table width="80%" align="center" bgcolor="#FFFFFF">
  <tr>
    <th height="86" colspan="2" scope="col"><img src="image/header.jpg" alt="" width="539" height="112" /> </th>
  </tr>
  <tr>
    <td width="22%" height="265">

<table border="0" cellspacing="0" cellpadding="0" width="165" id="navigation">
        <tr>
          <td width="165">&nbsp;</td>
        </tr>
        <tr>
          <td width="165"><a href="index.php?foo=home.php" class="navText">Startseite</a></td>
        </tr>
        <tr>
          <td width="165"><a href="index.php?foo=about.php" class="navText">&Uuml;ber uns </a></td>
        </tr>
        <tr>
          <td width="165"><a href="index.php?foo=projekte.php" class="navText">Projekte</a></td>
        </tr>
  <tr>
          <td width="165"><a href="index.php?foo=wp.php" class="navText">Wahlpflichtfach</a></td>
        </tr>
  <tr>
          <td width="165"><a href="index.php?foo=informatik.php" class="navText">Informatik</a></td>
        </tr>
        <tr>
          <td width="165"><a href="index.php?foo=links.php" class="navText">Links</a></td>
        </tr>
        <tr>
          <td width="165"><a href="index.php?foo=impressum.php" class="navText">Impressum</a></td>
        </tr></th>
    <th width="65%" scope="col">&nbsp;</th>
  </tr>
</table>
 <th colspan="3" scope="col"><p>
 <style type="text/css">
<!--
.Stil2 {color: #666666}
-->
</style>
<div style="width: 510; overflow: auto;">

<h3 align="left" class="Stil1">>>Startseite</h3>

<p>

<a><strong>Herzlich Willkommen</strong></a> </p>
<p>Auf der Homepage des 9er Informatikkurses der <a target="_blank" href="http://www.realschule.lohmar.de">Realschule Lohmar</a></p>
<p><img src="image/school.jpg" width="486" height="296" /></p>

Sie sind der

833
. Besucher!

</div>
      </p>    </th>
  </tr>
</table>
</body>
</html>

Code von style.css:

body {
 margin:0px;
 background-color: #666666;
 border-bottom-style: none;

}

td {
 font:11px Arial, Helvetica, sans-serif;
 color:#FFFFFF;
 }

a {
 color: #666666;
 }

a:hover {
 color: #666666;
 background-color: #FFFFFF;
 }

img { border: 0px;
background:#FFFFFF }

.Stil1 {color: #000000}

#navigation td {
 border-bottom: 1px solid #666666;
 }

#navigation a {
 font: bold 11px Arial, Helvetica, sans-serif;
 color: #666666;
 line-height:16px;
 letter-spacing:0.1em;
 text-decoration: none;
 display:block;
 padding:8px 6px 10px 20px;
 background-color: #FFFFFF;
 }

#navigation a:hover {
 color:#FFFFFF;
 background-color: #666666;
 }

#tagline  {
 font:11px Arial, Helvetica, sans-serif;
 color: #666666;
 letter-spacing:0.4em;
 line-height:18px;
 }
#navigation .navText Stil3 {
 color: #666666;
 background-color: #FFFFFF;
}

Ich würde mich echt freuen wenn mir einer helfen könnte dieses Menü zur Seite ausklappbar zu machen.
Es sollte ein wenig transparent sein und bei drüberfahren über die hauptpunkte sichtbar und unsichtbar werden.

Hoffe ihr habt ungefähr verstanden was ich meine.

Vielen Dank für jede Hife im vorraus.

MFG Daniel

P.S. Habe schon alles im Internet was ich gefunden habe ausprobiert aber es klappt leider nicht wie ich möchte.

  1. So schreibe doch mal meinen Hp-Link auf weil ich denke so kann mir eher jemand helfen.

    Hoffe es kommt keine schlechte Kiritk ich weiß das die Codes nicht so gut sind und das das Design nicht das tollste ist.

    Also:

    danielswebsite.de.tc

    MFG Daniel

    Schönes WE noch

  2. Hallo kingofrap,

    Auf deiner Webseite sehe ich anders als in oben angegebenem Code zwei öffnende BODY-Tags.

    Ich würde mich echt freuen wenn mir einer helfen könnte dieses Menü zur Seite ausklappbar zu machen.

    Wenn es beim Drüberfahren drüberklappen soll, muss das Menü mit absoluter Positionierung in Verbindung mit Schichtpositionen arbeiten.

    Es sollte ein wenig transparent sein und bei drüberfahren über die hauptpunkte sichtbar und unsichtbar werden.

    Zu Teiltransparenz gibt es vier verschiedene Modelle für vier verschiedene Browsertypen. Am besten liest du das bei Cybaer nach.

    P.S. Habe schon alles im Internet was ich gefunden habe ausprobiert aber es klappt leider nicht wie ich möchte.

    Die SELFHTML-Menüs hast du wirklich übersehen? Wie man ein Menü zur Seite statt nach unten ausklappt, sollte als Transferleistung machbar sein.

    Gruß Gernot

    1. Vielen Dank für die Schnelle Antwort.
      Werde mir nochmal alles genauer durchsehen wenn ich diesmal Probleme bekomme weil die Darstellung ungewollt anders aussieht kann ich ja hier nochmal posten.

      MFG Daniel