Anzeige

Menü probleme

Menü probleme | PSD-Tutorials.de

Erstellt von darkminde, 01.10.2015.

  1. darkminde

    darkminde Noch nicht viel geschrieben

    Dabei seit:
    14.05.2015
    Beiträge:
    25
    Geschlecht:
    männlich
    Menü probleme
    Hi ich nochmal irgenwie stelle ich mich heute einfach zu blöde an kann mir vll einer helfen?
    Habe ein menü mit css erstellt.
    Home / About / Portfolio / Login
    wenn ich nun auf Portfolio gehe Klappt es nach unten auf soweit ganz gut
    Equipment
    Photoshoots
    nun soll wenn ich bei Photoshoots bin es nach rechts und dann nach unten auklappen für die Jahre.
    ..
    Portfolio / 2015 / Januar
    Februar
    ..

    Aber irgenwie klapt das nicht siehe Quelltext:

    <nav>
    <ul>
    <li><a href="index.html">Home</a></li>
    <li><a href="shoot.html">About</a></li>
    <li>Portfolio
    <ul>
    <li><a href="shoot.html">Equipment</a></li>
    <li>Photoshoots
    <ul>
    <li>2015
    <ul>
    <li>Januar</li>
    <li>Februar</li>
    </li>
    </ul>
    </li>
    </ul>
    </li>
    <li>Login</li>
    </ul>
    </nav>

    Danke schonmal im vorraus.

    Dark
     
    #1      
  2. dn3d_fanboy

    dn3d_fanboy Aktives Mitglied

    Dabei seit:
    04.11.2011
    Beiträge:
    791
    Geschlecht:
    männlich
    Ort:
    Eitorf
    Software:
    VS Code, Notepad++, PS CC, Mapster32
    Kameratyp:
    Dat Teil im Häändy
    Menü probleme
    Da müsste man mal den CSS-Code sehen.
     
    #2      
  3. darkminde

    darkminde Noch nicht viel geschrieben

    Dabei seit:
    14.05.2015
    Beiträge:
    25
    Geschlecht:
    männlich
    Menü probleme
    @charset "utf-8";
    /* CSS Document */

    body { background: #222; font-family:Helvetica, sans-serif}

    nav {position:absolute; top:100px; left:200px; }

    nav ul {margin:0; padding:0; height:36px; box-shadow:0px 0px 32px 0px #111; border-radius:10px; width:auto;}
    nav ul li { position:relative; border-right:1px solid#222; list-style:none; float:left; background:#333; padding:10px; width:70px; text-align:center; transition:all 500ms; color:#999}
    nav ul li:first-child { border-radius:10px 0px 0px 10px}
    nav ul li:last-child {border-radius:0px 10px 10px 0px; border:none}
    nav ul li:hover {background:#0C0; color:#FFF}

    nav ul li:hover ul { height:auto; opacity:1;}
    nav ul li ul {height:0; overflow:hidden; opacity:0; position: absolute; top:40; left:0px}
    nav ul li ul li { width:130px;}
    nav ul li ul li:first-child { border-radius:10px 10px 0px 0px}
    nav ul li ul li:last-child {border-radius:0px 0px 10px 10px; border:none}

    nav ul li a {
    color: #999;
    text-decoration: none;
    }

    list-style: none;
     
    #3      
  4. dn3d_fanboy

    dn3d_fanboy Aktives Mitglied

    Dabei seit:
    04.11.2011
    Beiträge:
    791
    Geschlecht:
    männlich
    Ort:
    Eitorf
    Software:
    VS Code, Notepad++, PS CC, Mapster32
    Kameratyp:
    Dat Teil im Häändy
    Menü probleme
    Ich sehe gerade, dass du bei der vierten Ebene im HTML-Code die <ul>-Liste nicht korrekt schließt. Und ob das alles mit dem CSS-Code geht, kann ich auch nicht sagen, da der nur bis zur zweiten Ebene geht.

    Was genau funktioniert denn nicht?
     
    #4      
  5. darkminde

    darkminde Noch nicht viel geschrieben

    Dabei seit:
    14.05.2015
    Beiträge:
    25
    Geschlecht:
    männlich
    Menü probleme
    ab der zweiten ebene wo das menü nach rechts ausklappen soll beo Photoshoots er baut dann immer nur nach unten (unter portfolio und nicht nach rechts)
     
    #5      
  6. dn3d_fanboy

    dn3d_fanboy Aktives Mitglied

    Dabei seit:
    04.11.2011
    Beiträge:
    791
    Geschlecht:
    männlich
    Ort:
    Eitorf
    Software:
    VS Code, Notepad++, PS CC, Mapster32
    Kameratyp:
    Dat Teil im Häändy
    Menü probleme
    Na ja, da brauchst du dann eben den CSS-Code der dritten und vierten Ebene. Im Moment nimmt er den des Elternelements, also der Zweiten.
     
    #6      
  7. darkminde

    darkminde Noch nicht viel geschrieben

    Dabei seit:
    14.05.2015
    Beiträge:
    25
    Geschlecht:
    männlich
    Menü probleme
    kannst mir vll dabei helfen bei css bin ich nicht so fit habe da erst angefangen :(
     
    #7      
  8. patrick_l

    patrick_l Stereotyp(e)

    22
    Dabei seit:
    11.05.2008
    Beiträge:
    7.629
    Geschlecht:
    männlich
    Ort:
    NRW
    Software:
    CS6/CC2017, Affinity, Atom, Brackets, PHPStorm, Pug, Sass, Wacom
    Kameratyp:
    Canon DSLR [...]
    Menü probleme
    Vorweg, wir sind kein "mach mir mal" Forum. Hier bekommt jeder Hilfe zur Selbsthilfe. Wenn nötiges Grundlagenwissen fehlt, solltest du dir selbiges mit Hilfe von passender Fachlektüre und/oder passenden Tutorials aneignen. Hier auf PSD-Tutorials findest du einiges zu diesem Thema. Wenn es mehr sein darf, auch mal im Shop vorbeischauen.

    Auch im Internet findest du haufenweise Anleitungen, Snippets und der Gleichen. Sowohl reine CSS(3) Multi-Level Navigationen als auch mit JavaScript (jQuery). Also einfach mal explizit danach suchen und dann Schritt für Schritt an deine Website anpassen. Auf schnelle auch ein Link von mir:

    - 38 OpenSource CSS Dropdown Menüs

    Was jetzt dein CSS angeht, solltest du auch mehr Ordnung rein bringen. Arbeite unter anderem mit Klassen, um einzelne Elemente schneller selektieren zu können.

    Liebe Grüße, Patrick
     
    #8      
  9. darkminde

    darkminde Noch nicht viel geschrieben

    Dabei seit:
    14.05.2015
    Beiträge:
    25
    Geschlecht:
    männlich
    Menü probleme
    Hi patrick ich will ja nicht hier machmal und präsentiere mir das ergebniss ich will es ja lehrnen deshalb habe ich ja gefragt ob er mir helfen könte und nicht codet.

    Hab auch schon gegooglet aber leider nicht das passende gefunden.

    ich bedanke mich für den Link und werde es mal durcharbeiten.

    danke an alle
     
    #9      
  10. hub

    hub nicht ganz neu hier

    Dabei seit:
    11.06.2008
    Beiträge:
    1.116
    Geschlecht:
    männlich
    Ort:
    Taunus
    Software:
    PS,Lr. VS Code, NP++, ...
    Kameratyp:
    Sony a 6000
    Menü probleme
    Moin,
    um weiter zu experimentieren solltest du die zeile mit overflow mal auskommentieren
    Code (CSS):
    1. nav ul li ul {
    2.     height:0;
    3.    /*  overflow:hidden;  /* <-------------*/
    4.     opacity:0;
    5.     position: absolute;
    6.     top:40;
    7.     left:0px
    8. }
    und dann dafür sorgen, das ab der 3. Ebene ul mit top: 0 und left: 100% positioniert werden ...

    Gruß Ulli
     
    #10      
  11. darkminde

    darkminde Noch nicht viel geschrieben

    Dabei seit:
    14.05.2015
    Beiträge:
    25
    Geschlecht:
    männlich
    Menü probleme
    alles klar werde ich mal ausprobieren :)
     
    #11      
Seobility SEO Tool
x
×
×