Navigation + Hover

Dieses Thema im Forum "Webdesign" wurde erstellt von b-xXx, 6. Juni 2009 .

Schlagworte:
  1. 6. Juni 2009
    Zuletzt von einem Moderator bearbeitet: 14. April 2017
    hi rr'ler,

    und zwar hab ich diese navigation und möchte die nun auch coden.

    Bild

    meine frage ist:
    Wie bekomm ich es hin, dass der hover und der link auch unter den Ecke liegt?

    also bitte keine antwort, dass man die ecken als seperator oder ähnliches verwenden soll..
    will halt, dass der link des buttons bis in die ecke geht.

    Hoffe das man das auch irgendwie mit JS hinbekommt und kein flash braucht.

    Danke!

    bw's für hilfreichende antworten sind selbstverständlich.
     
  2. 6. Juni 2009
    AW: Navigation + Hover

    Nimm image-maps:
    (SELFHTML: HTML/XHTML / Grafiken / Verweis-sensitive Grafiken (Image Maps))
    Mit shape="poly" kannst du dir deine Dreiecke bauen.
     
  3. 6. Juni 2009
    AW: Navigation + Hover

    gut das hat ich auch schon gefunden, aber war mir nicht sicher, ob es damit funzt.
    dank dir - werd das mal versuchen.
    bw hast du


    wenn jemand noch ein passnedes beispiel hat, kann er es ja freundlicher weise mal posten.

    Danke!

    EDIT: also ich will den hintergrundbalken ja slicen.. also bg und so sollen sich der länge der links etc anpassen.. geht das dann trotzdem?
     
  4. 6. Juni 2009
    AW: Navigation + Hover

    wenn du imagemaps benutzt, ist das ja 1. nicht im hintergrund und 2. brauchst du auch nicht slicen...

    wenn du unbedingt willst, kannst du aber auch alle teile des balkens absolut positionieren, um jedes bild einen link setzen und die dann so übereinander legen, dass due die ecken immer mit im link hast...
     
  5. 6. Juni 2009
    AW: Navigation + Hover

    naja also ich meine das so --> ich würde den grund balken in eine 1px breite grafik machen --> die ecke extra und dann die ecke mit dem link verknüpfen und dem link einen hover geben..

    weil die navi soll in der breite dynamisch bleiben.

    aber hab halt echt kp^^..
    wäre gut wenn einer ein richtiges beispiel mit erklärung dazu hat (also zu image maps)
     
  6. 7. Juni 2009
    AW: Navigation + Hover

    Evtl könntest du normale Links und image-maps kombinieren:
    Die 1px-breite Grafik machst du als ganz normalen Link und für die Spitzen dann imagemaps.
     
  7. 7. Juni 2009
    AW: Navigation + Hover

    naja gut, aber dann müsste ich doch trotzdem jedes mal die genauen koordinaten wissen richtig?
     
  8. 8. Juni 2009
    AW: Navigation + Hover

    Die Werte beziehen sich jeweils auf die obere linke Ecke der Grafik. Das bedeutet, dass die Koordinaten überall gleich sein sollten.
     
  9. 8. Juni 2009
    AW: Navigation + Hover

    naja aber wenn ich dann das dreieck angebe..
    dann muss ich ja die breite jedes buttons wissen oder etwas nicht? oder geb ich einfach damit die breite an etc.
     
  10. 9. Juni 2009
    AW: Navigation + Hover

    Nee, müsstest du nicht.
    Aber mir ist eingefallen, dass das nicht für den hover-Effekt funktionieren würde sondern nur für die Linkfunktion.
    Der Hovereffekt ist mit CSS und HTML wohl nicht möglich.
    Mit Javascript schon, allerdings müsstest du hierfür wohl tatsächlich immer die Koordinaten jedes Links wissen.
     
  11. 9. Juni 2009
    AW: Navigation + Hover

    Wieso nimmst du nicht einfach 2 Images, eins mit Hover und eins ohne Hover?
    Dabei reicht in Link von der Spitze des Vorgänger Links bis zum Anfang der Spitze des eigenen Links.
    Code:
    > TEXT |
    Code:
    > TEXT |
    Code:
    > TEXT |
    Wenn man dann alle zusammen fügt passt das wieder. Für den Anfang und Ende benötigt man nochmals jeweils 2 Images.


    Oder habe ich dich jetzt falsch verstanden? Male mal auf wo der Link überall sein soll.
     
  12. 9. Juni 2009
    AW: Navigation + Hover

    nja genau das will ich ja nicht.. wäre ja billig
    will ja das die spitze zu dem link gehört.
    und beim hover sich mitverfärbt
     
  13. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.