Bilderlinkwechsel

[Arca]

Ich hätte gerne dass sich, wenn ich mit der Maus über einen Bildlink gehe dann ein neues Bild erscheint:

<a href="Beispiellink"><img src="Beispiel"</img></a>

Ich hoffe dass mir da einer helfen kann.

 

[_Thor_]

Das ist ein Fall für CSS, nicht für HTML.

Helfen wird dir die Pseudoklasse :hover (:hover: Mouseover-Effekt: CSS-Referenz auf CSS 4 You - The Finest in Stylesheets).

 

[Arca]

ja das mit dem hover weiß ich. aber ich habe schon das probiert:

a.link:hover {
         image: Beispielbild}

ich entschuldige mich auch dafür das der beitrag hier gelandet ist weil ich nicht genau wusste in welche kategorie ich das tun sollte.

 

[vitus37]

Das macht man mit CSS.
Stichwort :hover

Das ganze ist dann zB so zu verwirklichen:
HTML-Code:

<a href="#" class="link"></a>

und der zugehörige CSS-Code:

a{
font-family:Verdana;
font-size:12px;
color:#000000;
font-weight:normal;
}

a.link {
display:block;
width:150px;
padding:5px;
background-image:url("beispiel.png");
text-align:center;
}

a.link:hover {
color:#ffffff;
background-image:url("beispiel2.png);
}

So könnte man es machen, wenn du ein Bild hast, wo du noch einen Text hinüber legen möchtest. Wenn das Bild wirklich ein Bild sein soll (also mit <img>-tag) und es sich ändern soll, wüsste ich auch keine Lösung. Vielleicht geht soetwas mit JavaScript oder vielleicht sogar auch mit CSS.

PS: Ähnliches Beispiel gibts hier: http://www.css4you.de/trickkiste/tr00023.html
LG

 

[_Thor_]

a.link:hover {
         image: Beispielbild}

Das kann auch so nicht funktionieren, da man per CSS nur Hintergrundbilder setzen kann. Wenn sich das image ändern soll, brauchst du JavaScript.

 

[vitus37]

Das kann auch so nicht funktionieren, da man per CSS nur Hintergrundbilder setzen kann. Wenn sich das image ändern soll, brauchst du JavaScript.

Habe ich ja drunter geschrieben

 

[Elroy]

Wenn sich das image ändern soll, brauchst du JavaScript.

Hallo.

Und wieso kann das nicht mit CSS gehen?
Oder habe ich hier etwas falsch verstanden?

Gruss
Elroy

 

[_Thor_]

Weil es einen Unterschied gibt zwischen einem Hintergrundbild und einer Grafik die mit dem Tag <img> eingebunden ist. Das Hintergrundbild kann man per CSS ändern, das <img> nicht.

Ein Hintergrundbild dient dem Design, ein <img> gehört zum Inhalt. Design macht man mit CSS, Inhalt mit HTML.

In deinem Beispiel wird nur das <img> unsichtbar gemacht, wodurch das Hintergrundbild sichtbar wird. Ein wirklicher Wechsel ist das nicht.