Loading...   Upload Image

Navigation - wie am geschicktesten?Forum » Designzone » Search » Navigation - wie am geschicktesten?

Neues Thema verfassen Neues Thema

  • aprilUser ist offline
    Beginner


    april

    Registriert: 10.10.2008
    Beitraege: 39

    10.08.2009 um 12:33 Uhr

    Wollte einfach mal doof fragen, wie ich das am besten mach.
    Eine horizontale Navigation, beim hovern von einem Menüpunkt, färbt sich das Feld um und ein kleiner Pfeil bildet sich nach rechts (nicht nach unten) und überlappt teilweiße das Feld vom nächsten Navipunkt. Imagemappen ist mir zu langwierig. Gibts da was kürzeres? Wie krieg ich das nur gecodet hin?

    Und ein Beispiel find ich auch nirgends. Ich such jetzt seit 2 Stunden nach so einer Beispielnavigation, die so aussieht. Hat da jemand vllt was passendes zur Hand?



    Der Beitrag wurde insgesamt 1 mal editiert, zuletzt 10.08.2009 um 13:53 Uhr ...
    .
  • AliceUser ist offline
    Admin


    Alice

    Registriert: 14.12.2006
    Beitraege: 1059

    11.08.2009 um 23:32 Uhr

    Du nehmen CSS...
    Ne absolute Position der einzelnen Links, sollte zum gewuenschten Ergebnis fuehren ...



    ... { signatur } ...
  • aprilUser ist offline
    Beginner


    april

    Registriert: 10.10.2008
    Beitraege: 39

    12.08.2009 um 11:03 Uhr

    Ja^^ aber das Problem ist, dass sich das gegenseitig überschendiet.
    Ich mals mal auf.
    +-----------------+--------------------+
    |***************|****************|
    |*************** >***************|
    |***************|****************|
    +-----------------+--------------------+


    *= freies Feld, mit Leerzeichen hat sich alles zusammengerückt
    Ist jetzt verrutschtm durch die andere Schrift als hier unten im Inout.
    Ich hoffe man kann trotzdem erkennen, was ich meine. Wenn nicht mal ichs mit Photoshop.

    So, das Linke ist beim Mouseover und das Rechte ist normal.
    Also, beim Onmouseover überschneidet sich ja das Feld mit dem Nächsten.
    Und wie soll ich das im CSS festlegen? Tut mir leid, Alice. Ich versteh das nicht, wie das gehen soll.



    Der Beitrag wurde insgesamt 1 mal editiert, zuletzt 12.08.2009 um 11:11 Uhr ...
    .
  • AliceUser ist offline
    Admin


    Alice

    Registriert: 14.12.2006
    Beitraege: 1059

    12.08.2009 um 13:37 Uhr

    Du musst eigentlich nur bei dem a:hover dann mit nem z-index arbeiten, damit die 'Ebene' dann hoeher liegt als die anderen und die Position kannst du ja ganz einfach mittels position: absolut; bzw. positions: relative und der Angabe von top: Xpx; und left: Xpx; bestimmen ...

    So kannst du problemlos mehrere 'Schichten' uebereinander legen.

    Du musst allerdings aus dem Inline Element a:hover ein Blockelement machen mittels display: block; ...

    Schau mal hier vorbei, da wird ein Tooltip bei :hover erstellt, da liegt der Text des Tooltips auch ueber dem normalen Text...

    Liebe Gruesse
    Alice



    ... { signatur } ...
  • AliceUser ist offline
    Admin


    Alice

    Registriert: 14.12.2006
    Beitraege: 1059

    12.08.2009 um 13:42 Uhr

    Du musst eigentlich nur bei dem a:hover dann mit nem z-index arbeiten, damit die 'Ebene' dann hoeher liegt als die anderen und die Position kannst du ja ganz einfach mittels position: absolut; bzw. positions: relative und der Angabe von top: Xpx; und left: Xpx; bestimmen ...

    So kannst du problemlos mehrere 'Schichten' uebereinander legen.

    Vorraussetzung, das es funktioniert ist, dass du aus dem Inline Element ein Blockelement machst mittels display: block; ...

    Schau mal hier vorbei, da wird ein Tooltip bei :hover erstellt, da liegt der Text des Tooltips auch ueber dem normalen Text...

    Liebe Gruesse
    Alice



    ... { signatur } ...
  • aprilUser ist offline
    Beginner


    april

    Registriert: 10.10.2008
    Beitraege: 39

    12.08.2009 um 21:25 Uhr

    Das ist geschickt. Wusste ich gar nicht.
    Jetzt hab ichs verstanden. Danke. War ganz wichtig.



    .

[ 1 ] Seite 1 von 1


Affiliates:   Colorful Gfx  •   Gallery Yuri  •   Design Grafixx  •   Blue-Graphics  •   The Seduction  •   Chibi Graphics  •   Pat DG  • Show all ...
designenlassen.de - Der Design-Marktplatz für Webdesign, Logo-Design, Flyerdesign u.v.m.        ALL-INKL.COM - Webhosting Server Hosting Domain Provider