Michael Pommerenke: Grafik-Link mit onmouseover-Funktion

Schönen Guten Abend,

nach einem Nachmittag rumprobieren will ich mein Problem nun mal hier schildern (für ein normales HTML-Dokument):

Ich möchte gern ein Bild als Link haben (an sich kein Problem), aber bei "onmouseover" möchte ich, dass es ein anderes Bild an gleicher Stelle anzeigt (und beim verlassen wieder das alte).

Kann mir irgendjemand einen Tip geben???
Ich wäre echt glücklich!

mfg Michael

  1. Hallo Michael,

    Ich möchte gern ein Bild als Link haben (an sich kein Problem), aber bei "onmouseover" möchte ich, dass es ein anderes Bild an gleicher Stelle anzeigt (und beim verlassen wieder das alte).

    http://selfhtml.teamone.de/javascript/beispiele/buttons.htm?

    Grüße aus Nürnberg
    Tobias

    --
    Selfcode: sh:( fo:) ch:? rl:( br:< n4:& ie:% mo:| va:) de:] zu:) fl:( ss:| ls:[ js:|
  2. <a href="dummy.htm" onMouseOver="bild.src='img/bild2.gif'" onMouseOut="bild.src='img/bild1.gif'" onClick="bild.src='img/bild3.gif'"><img src="bild1.gif" name="bild"></a>

    Bild muß einen Namen (name="bild") haben, damit man es ansprechen kann!!!

    Gruß Heike

    1. Vielen Dank erstmal,
       wo gebe ich denn den Bildern die Namen (im "Head", oder wie und wo) und muss ich das für Original und "onmouseover"-Bild machen?
      Danke für deine Hilfe
      Gruss MICHA

  3. Hallo,

    Ich möchte gern ein Bild als Link haben (an sich kein Problem), aber bei "onmouseover" möchte ich, dass es ein anderes Bild an gleicher Stelle anzeigt (und beim verlassen wieder das alte).

    So etwas macht man neuerdings mit CSS, falls du Interesse hast schreibe ich wie, falls du sowieso kein Interesse hast lasse ich es bleiben, dann habe ich keine Lust mich anzustrengen. Sag also bescheid, ob du es wissen willst. Zuständig dafür ist :hover

    Grüße
    Jeena Paradies

    --
    "Of course it does not work, but look how fast it is!"
    1. Hallo, ich hätte schon Interesse, vor allem, wenn es mit CSS einfacher oder schneller funktioniert als anders.
      Aber ich will dich auch zu nix zwingen. Jedoch wenn du Lust hast wäre ich dir sehr dankbar.
      viele Grüsse MICHA

      1. Hallo,

        Hallo, ich hätte schon Interesse, vor allem, wenn es mit CSS einfacher oder schneller funktioniert als anders.
        Aber ich will dich auch zu nix zwingen. Jedoch wenn du Lust hast wäre ich dir sehr dankbar.

        Wenn Interesse da ist, dann mache ich das gerne. Schneller und eifacher ist es aber nicht, doch sauberer, und es funktioniert sogar, wenn JS ausgeschalten ist.

        Am einfachsten wäre es, wenn du dich dafür entscheiden würdest für den Text richtigen Text zu nehmen. Dann würdest du nämlich für den Hintergrund dein Bilchen nehmen, und für :hover das andere Bildchen als Hintergrund.

        Das wäre so wie hier bei meiner Seite: http://jeenaparadies.servebeer.com/open/Webs/gutgesell3/

        Lass dich durch den vielen CSS Code nicht verunsichern, der ist dafür da, damit das Bildchen oben wechselt. Hier mal ein Link zum lesen:

        http://selfhtml.teamone.de/css/eigenschaften/pseudoformate.htm#link_visited_hover_active_focus

        Falls du Fragen hast immer her damit.
        Grüße
        Jeena Paradies

        --
        "Of course it does not work, but look how fast it is!"
        1. Vielen Dank, klingt recht gut diese Möglichkeit (obwohl ich aus deiner Beispielseite nicht ganz schlau werde).
          Eine Frage noch: Kann ich den Befehl :hover auch für jeden Link (mit Hintergrundbild) einzeln definieren?? Dann hätte ich ja genau das, was ich will.
          Gruss MICHA

          1. Hallo,

            Vielen Dank, klingt recht gut diese Möglichkeit

            Das wird aber im NS 4.x nicht funktionieren, wenn du aber wirklich auf CSS setzten willst werden andere Sachen auch nicht funktionieren, so dass so etwas nicht mehr ins Gewicht fällt.

            (obwohl ich aus deiner Beispielseite nicht ganz schlau werde).

            Macht nichts, da habe ich eine Woche dran rumgebastelt, und im IE 5.0 & 5.5 funktioniert das Bilchen wechsel dich Spiel oben links immer noch nicht.

            Eine Frage noch: Kann ich den Befehl :hover auch für jeden Link (mit Hintergrundbild) einzeln definieren?? Dann hätte ich ja genau das, was ich will.

            Ja du muss dann jedem link eine id geben und jeden mittels #bild1:hover in deiner CSS Datei deffinieren.

            Grüße
            Jeena Paradies

            --
            "Of course it does not work, but look how fast it is!"
          2. Hi,

            mir scheint fast, Du suchst eher nach Pseudo-Buttons bzw. CSS-Formatierte Links oder auch Textlinks mit Austausch von Hintergrundgrafiken. Ist hier: http://www.1ngo.de/web/button-demo.html vielleicht was passendes dabei?

            freundliche Grüße
            Ingo

            1. habe viele interessante Dinge auf deiner Seite gefunden.
              Kannst du mir vielleicht ein Beispiel geben, wie ich Hintergrund- und Mousover-Bild für jeden einzelnen Link definiere.
              Wäre echt nett.
              Gruss MICHA

              1. Hi,

                Kannst du mir vielleicht ein Beispiel geben, wie ich Hintergrund- und Mousover-Bild für jeden einzelnen Link definiere.

                Hast Du denn für jeden Link tatsächlich ein anderes Bild und nicht nur den anderen Linktext? Denn sonst könntest Du Dir viel Arbeit und Ladezeiten sparen, jedenfalls wenn die Linktexte nicht gerade in einer ausgefallenen Schrift dargestellt werden sollen.

                Aber wenn Du den Aufwand tatsächlich brauchst, dann gebe jedem Link eine eigene ID:
                <div id="link1">
                und sprich sie dann entsprechend im CSS an:
                a#link1:link, a#link1:visited {...}

                freundliche Grüße
                Ingo