Ergebnis 1 bis 4 von 4

Thema: Spezieller Hovereffekt, aber wie umsetzen?

  1. #1
    Teeny
    Registriert seit
    03.06.2007
    Beiträge
    26
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Spezieller Hovereffekt, aber wie umsetzen?

    Hallo zusammen!
    Bin auf diese Homepage gestoßen:
    www.mylittlefabric.com

    Wenn man dort über die Menüpunkte fährt, fährt eine Grafik raus.

    Wie kann ich das für meine Homepage umsetzen?

    Mein Menü besteht aus einer Grafik die durch die Mapping-Funktion unterteilt und verlinkt wird. Derzeit ist nur ein Link gesetzt (Home):

    HTML-Code:
    <img style="width: 900px; height: 24px;" alt=""
     src="img/header.gif" usemap="#FPMap0">
    Lässt sich dieser Effekt bei mir umsetzen in Verbindung mit CSS?

    Hier meine Layout.css
    Code:
    #main { width:900px; margin:50px auto; text-align:left;border:none;
        -moz-border-radius-topleft: 8px; -webkit-border-top-left-radius: 8px; -khtml-border-top-left-radius: 8px; border-top-left-radius: 8px;
        -moz-border-radius-topright: 8px; -webkit-border-top-right-radius: 8px; -khtml-border-top-right-radius: 8px; border-top-right-radius: 8px;
        -moz-border-radius-bottomleft: 8px; -webkit-border-bottom-left-radius: 8px; -khtml-border-bottom-left-radius: 8px; border-bottom-left-radius: 8px;
        -moz-border-radius-bottomright: 8px; -webkit-border-bottom-right-radius: 8px; -khtml-border-bottom-right-radius: 8px; border-bottom-right-radius: 8px; background:#fff;
    }
    #header {height:150px;}
    #content {height:600px;}
    Und hier die Style.css
    Code:
    * {margin:0; padding:0; font-size:100%;}
    a img {border:0;}
    body{background:url(../img/fondo1.gif) top repeat}
    #header{overflow:hidden;}
    #header .logo{padding:10px 0 0 310px;}
    #content{overflow:hidden;}
    #content .imageleft{padding:0;}
    #content .imageright{padding:0;}
    #content .buttonleft{padding-top:17px;}
    #content .buttonright{padding-top:17px;}
    Vielen Dank für eure Hilfe!
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    König(in)
    Registriert seit
    07.02.2009
    Ort
    Leipzig
    Beiträge
    1.391
    Danke
    2
    Bekam 21 mal "Danke" in 20 Postings

    Standard AW: Spezieller Hovereffekt, aber wie umsetzen?

    Das ist eine CSS3-basierte Animation die bei deinem "Menü" so nicht möglich wäre. Du hast nämlich kein Menü sondern, wie Du selbst sagst, eine ImageMap. Das wird von keiner Suchmaschine als Menü wahrgenommen, auch ist es schwerer bis gar nicht stylebar. Du solltest dein Menü zu einem echten Menü - also einer Aufzählungsliste - umbauen, per CSS gestalten und dann kannst Du auch so eine CSS3-Animation einbauen.

  3. #3
    Teeny
    Themenstarter

    Registriert seit
    03.06.2007
    Beiträge
    26
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Spezieller Hovereffekt, aber wie umsetzen?

    Vielen Dank für deine Antwort!
    Schade, dass es nicht umsetzbar ist.
    Ich habe das als Grafik gemacht, da als Menü eine Schriftart verwendet werden soll, die auf dem "normalen" Rechner nicht dargestellt würde.

  4. #4
    König(in)
    Registriert seit
    07.02.2009
    Ort
    Leipzig
    Beiträge
    1.391
    Danke
    2
    Bekam 21 mal "Danke" in 20 Postings

    Standard AW: Spezieller Hovereffekt, aber wie umsetzen?

    Moderne Browser lassen auch das Nachladen von beliebigen Schriftarten zu um bestimmte Inhalte mit diesen zu rendern. Schau dich mal nach der CSS-Eigenschaft font-face um.

    Wichtig: die Schriftart muss dies rechtlich auch erlauben.

Ähnliche Themen

  1. Problem mit spezieller Verlinkung
    Von schwizer im Forum HTML & CSS Forum
    Antworten: 12
    Letzter Beitrag: 27.01.2007, 16:29
  2. opera verschluckt hovereffekt
    Von AH!-Designs im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 1
    Letzter Beitrag: 11.08.2006, 13:36
  3. Meine Navileiste - Hovereffekt?
    Von matthias im Forum HTML & CSS Forum
    Antworten: 26
    Letzter Beitrag: 05.08.2006, 17:29
  4. Liste mit Bilder für Hovereffekt
    Von mr_jingles im Forum Forum für Grafiken und Bildbearbeitung
    Antworten: 3
    Letzter Beitrag: 25.09.2005, 18:45
  5. spezieller Hyperlink
    Von Madl im Forum HTML & CSS Forum
    Antworten: 3
    Letzter Beitrag: 05.08.2003, 20:17

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •