Mainmenu

RemusGTR · 04.01.2011

Hi
auf meiner Seite Vier-Pfoten-Welt ist auf der linken Seite ein Menu das auch funktioniert.

Was ich als etwas störend empfinde ist, wenn ich mit der Maus über die Namen
gehe, öffnet sich jeweils ein kleines "Fensterchen" mit Story und Galerie. Will ich dann auf den nächst darunter geschriebenen Namen mit dem Mauspfeil, dann springt dieser auf den übernächsten Namen. Man muß
dann immer seitlich auf den betreffenden Namen ansetzen.
Gibt es dafür eine Lösung mit CSS oder muss das Problem mit Java oder Flash gelöst werden?

Gruß Remus

GrafiKman · 04.01.2011

AW: Mainmenu

Warum wird eigentlich rechts der Browser und die Ip des users angezeigt?

Tim1901091 · 04.01.2011

AW: Mainmenu

RemusGTR schrieb:
Hi
auf meiner Seite Vier-Pfoten-Welt ist auf der linken Seite ein Menu das auch funktioniert.

Was ich als etwas störend empfinde ist, wenn ich mit der Maus über die Namen
gehe, öffnet sich jeweils ein kleines "Fensterchen" mit Story und Galerie. Will ich dann auf den nächst darunter geschriebenen Namen mit dem Mauspfeil, dann springt dieser auf den übernächsten Namen. Man muß
dann immer seitlich auf den betreffenden Namen ansetzen.
Gibt es dafür eine Lösung mit CSS oder muss das Problem mit Java oder Flash gelöst werden?

Gruß Remus

Das geht auf jeden Fall ohne JavaScript oder Flash (und du solltest auch definitiv darauf verzichten!). IE5.5 und IE6 könnten zwar mit einer rein CSS-basierten Lösung so ihre Problemchen bekommen (die beiden unterstützen :hover nur für <a>-Elemente), aber für alle moderneren Browser sollte das kein Problem darstellen.

Übrigens: Sehr schön eingerücktes CSS! Gefällt mir. Du solltest dich allerdings mal mit Kurzschreibweisen befassen:

Code:

padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;

kann man auch als

Code:

padding:0;
margin:0;

schreiben. Bei Border geht das ebenfalls:

Code:

border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #999;

wird dann zu

Code:

border-right:1px solid #999;

Das (X)HTML solltest du nochmal überarbeiten. Da stimmt einiges von der Semantik her nicht.

Aber zu deinem Problem mit der Navigation:

Code:

<!DOCTYPE html>
<html lang="de">
    <head>
        <meta charset="utf-8" />
        <title>Navigation</title>
        <style type="text/css">
            li:hover li {
                display:block;
            }
            li li {
                display:none;
            }
        </style>
    </head>

    <body>
        <div id="navigation">
            <ul>
                <li>Menüpunkt 1
                    <ul>
                        <li>Unterpunkt 1</li>
                        <li>Unterpunkt 2</li>
                    </ul>
                </li>
                <li>Menüpunkt 2
                    <ul>
                        <li>Unterpunkt 1</li>
                        <li>Unterpunkt 2</li>
                    </ul>
                </li>
                <li>Menüpunkt 3
                    <ul>
                        <li>Unterpunkt 1</li>
                        <li>Unterpunkt 2</li>
                    </ul>
                </li>
                <li>Menüpunkt 4
                    <ul>
                        <li>Unterpunkt 1</li>
                        <li>Unterpunkt 2</li>
                    </ul>
                </li>
            </ul>
        </div>
    </body>
</html>

Die zwei Code-Zeilen CSS sind eigentlich alles, was du für die Navigation brauchst. Klar, das sieht jetzt noch nix aus, aber es geht ja im Moment auch nur um die Navigation. Ich habe HTML 5 verwendet, mit XHTML 1.0 Transitional funktionierts natürlich auch, wenngleich die Strict-Variante davon besser wäre (hat aber keinerlei Einfluss auf die Funktionalität von CSS).

RemusGTR · 04.01.2011

AW: Mainmenu

Danke für die Hilfe.
Das werde ich mal ausprobieren.Das im Quelltext nicht alles ok ist weiß ich,
aber ich lerne ja noch und bin für jede Hilfe dankbar.

@GrafiKman
Die IP wird nur angezeigt weil ich für mein Online Rennfahren öfters die IP von mir brauchte und ich sie mir dort anzeigen lassen konnte.

RemusGTR · 09.01.2011

AW: Mainmenu

Was muss denn in meiner CSS geändert werden damit die Hauptnavigation nicht auseinanderfährt wenn das Submenu angezeigt wird?