Wie realisiert man speziellen Mouseover?

Hallo,

ich bin am Suchen mit Google, finde aber nicht die gewünschte Funktion. Folgendes Bild soll verdeutlichen, was ich erreichen möchte. Beim überfahren der Bilder 1 bis 5 sollen die beim jeweiligen Mouseover an der Stelle des großen Bildes angezeigt werden und auch stehen bleiben.
Also mouseover Bild 1 -> Bild 1 wird groß angezeigt
mouseover Bild 2 -> Bild 2 wird groß angezeigt

Fahre ich mit der Maus über Text oder ähnliches, soll das zuletzt angezeigte große Bild angezeigt bleiben.

Wie heißt diese Funktion? Kann man sie ohne JavaScript realisieren?

Danke für Hinweise, Tipps und/oder Links

 

Nein, ohne Javascript geht das nicht.

Q&D:

Code:

<javascript>
function zoom(id) {
document.getElementById("bild1").display="none";
document.getElementById("bild2").display="none";
document.getElementById("bild3").display="none";

document.getElementById(id).display="block";

}
</javascript>


[...] 

<img src="klein-1.jpg" onmouseover="zoom('bild1');">
<img src="klein-2.jpg" onmouseover="zoom('bild2');">
<img src="klein-3.jpg" onmouseover="zoom('bild3');">

<img src="gross-1.jpg" id="bild1" style="position: absolute; top: 100px; left: 100px; display:none;">
<img src="gross-2.jpg" id="bild2" style="position: absolute; top: 100px; left: 100px; display:none;">
<img src="gross-3.jpg" id="bild3" style="position: absolute; top: 100px; left: 100px; display:none;">

Nur als prinzipielle Anregung. Vervollständigen und Optimieren darfst du selbst...

 

Das ist durchaus ohne JavaScript möglich. Auf einer ehemaligen Website von mir habe ich eine derartige Lösung verwendet. Ich bin mir nicht mehr sicher, wo ich das gefunden habe, aber ich glaube, es war eine abgewandelte Version von dem hier (also entsprechend angepasst und mit einem Bild als "Untermenü-Punkt").

 

Der Ansatz ist nicht uninteressant. Einen Nachteil sehe ich aber trotzdem: Mit JS kann man das Ganze so gestalten, dass die großen Bilder erst bei Bedarf nachgeladen werden. Bei der CSS-Variante werden sie bereits beim Seitenaufruf mit ausgeliefert.

 

Da hast du Recht. Das lässt sich wirklich nur mit JavaScript machen.

Wenn es also viele große Bilder sind, dann kann die CSS-Technik durchaus längere Ladezeiten zur Folge haben. Da kann am besten auch gleich das Thumbnail per Browser runterskalieren lassen, sodass jedes Bild nicht einmal in einer Vorschau-Ansicht und in einer großen Ansicht geladen werden muss, sondern nur einmal.