1. Dashboard
  2. Artikel
  3. Mitglieder
    1. Letzte Aktivitäten
    2. Benutzer online
    3. Team
    4. Mitgliedersuche
  4. Forum
    1. Unerledigte Themen
  • Anmelden
  • Registrieren
  • Suche
Dieses Thema
  • Alles
  • Dieses Thema
  • Dieses Forum
  • Artikel
  • Seiten
  • Forum
  • Erweiterte Suche
  1. HTML - Webmaster Forum
  2. HTML / Webmaster Forum
  3. HTML & CSS Forum

Verlinkte Grafiken

  • Joerg7777777
  • 2. Februar 2007 um 18:29
  • Joerg7777777
    Teeny
    Beiträge
    21
    • 2. Februar 2007 um 18:29
    • #1

    Wenn ich eine Grafik verlinkt habe und ich möchte, dass wenn man mit dem Mauszeiger drüberfährt statt der verlinkten Grafik, eine andere Grafik erscheint, wie mache ich das?

    Ich habe zwei Bilder als attachment eingefügt damit ihr verstehst was ich meine.

    Bild 1 ist verlinkt mit einer Seite.
    Wenn der Mauszeiger drüber ist soll als "hover" Bild 2 erscheinen.
    Wie geht das? Oder ist das mit HTML nicht möglich?

    Bilder

    • home_visited.jpg
      • 1,08 kB
      • 47 × 17
    • home_link.jpg
      • 1,09 kB
      • 47 × 17
  • driver
    Forum Guru
    Reaktionen
    6
    Beiträge
    20.727
    • 2. Februar 2007 um 18:39
    • #2

    benutz mal die suche....

    suche nach rollover oder mouseover. gibt schon eine masse an beiträgen dazu.
    (lösung geht via css oder via java-script)

    >> die icq-schreiberlinge bitte dies hier beachten

    [Blockierte Grafik: http://www.devil-driver.de/stuff/forum-banner.png]

    1679 entdeckte Gottfried Wilhelm Leibniz das Binärsystem, bei einem Gespräch mit seiner Mutter: "Ja..., Nein..., Nein..., Nein..., Ja..., Ja..., Nein..."

  • sejuma
    Kaiser(in)
    Reaktionen
    5
    Beiträge
    2.720
    • 2. Februar 2007 um 19:02
    • #3

    Schreibe dies in den Headbereich, also vor "</head>" oder in eine externe CSS-Datei

    Code
    <style type="text/css">
    
    
    a.link1 {
    display:block;
    width:47px;
    height:17px;
    background-image:url(home_link.jpg.jpeg);
    }
    
    
    a.link1:hover {
    background-image:url(home_visited.jpg.jpeg);
    }
    </style>
    Alles anzeigen

    Der Link lautet dann so:

    Code
    [url='zielseite.html'][/url]

    Für andere Butteons machst du das gleiche, indem du überall "link1" mit "link2" ersetzt und andere Buttons einfügst.

    [Blockierte Grafik: http://www.ohne-css.gehts-gar.net/img/banner/banner350x20.png]
    sejuma's CSS-Einsteigerkurs

Tags

  • bilder
  • html
  • link
  • style
  • jpg
  • text
  • grafik
  • java
  • suche
  • code
  • mauszeiger
  • masse
  • lösung
  • script
  • jpeg
  • css
  • image
  • hover
  • rollover

Benutzer online in diesem Thema

  • 1 Besucher
  1. Datenschutzerklärung
  2. Impressum
Community-Software: WoltLab Suite™