Script-Problem

[Neckar]

Hallo zusammen,
ich bräuchte bitte mal Unterstützung.

Ich habe ein script, das die Funktion hat, ein Bild größer anzeigen zu lassen, wenn man nur mit der Maus drüberfährt. Beim entfernen der Maus vom Bild verschwindet das große Bild wieder.

Ich vermute mal stark, dass der Fehler im Css bei

„background-image: url (bildgross.jpg);“

liegt.
Den Rahmen des großen Bild, also wie wenn es „border 1“ wäre, kriege ich ja angezeigt, mehr leider nicht.

Weiterhin ist das Script wohl nur für ein Bild. Ich bräuchte das aber für mehre Bilder. Es soll also jedes einzelne Bild vergrößert werden können, deshalb denke ich mal, dass ich mit meiner Vermutung nicht so ganz falsch liege. Aber was müsste denn dann der Klammerinhalt sein? Oder liege ich da völlig falsch? Könnte mir da bitte jemand behilflich sein?

Css

a.info{
position:relative;
z-index:1;
color:#000;
text-decoration:none}

a.info:hover{z-index:2;}

a.info span{
display: none;
}

a.info:hover span{
display:block;
position:absolute;
background-image: url(bildgross.jpg);
top:100px; left:200px;width:250px; height:300px;
}

Html-Code

---

Vielen Dank an Euch, wie immer

Gruß Manfred

[Stefan_eb87c0]

Hallo Manfred,

du versuchst den Hintergrund eines Bildes zu aendern, der ja allerdings schon vom Bild ueberdeckt wird. Also im Prinzip als ob du dir ein Bild an die Wand haengst und dahinter die Wand rot streichst - dann siehst du das rote hinter dem Bild auch nicht.
Nur mit CSS wirst du bei der Bildvorschau auf viele Probleme stossen. (Bildskalierung z.B.) Ich kann dir als gute Alternative fertige Javascripte fuer Bildvorschauen empfehlen: Fancybox oder Lightbox2

Gruss
Stefan