nicht angemeldet
Onmouseover Bild wird nicht zu allen Seiten hin gleichmäßig groß
0 
Auge
Onmouseover Bild wird nicht zu allen Seiten hin gleichmäßig groß
Hallo an alle,
ich brauche dringend Hilfe.
Ich habe ein Problem mit dem Mouseovereffekt.
Ich möchte gerne, dass ein bestimmtes Bild beim Überfahren mit der Maus zu allen Seiten hin gleichmäsig vergrößert wird.
Also das mit dem Mouseovereffekt habe ich ja schon hinbekommen, das Bild wird auch groß, doch die eine Ecke links oben bleibt immer gleich und der rest des Bildes vergrößert sich nach rechts unten.
Das ganze soll etwa so aussehen:
http://www.ahwi.com/index.htm
Mein aktueller Quelltext sieht so aus:
<html>
<head>
<script language="JavaScript">
<!--
<aus1 = new Image();>
<aus1.src = "personklein.jpg";>
<an1 = new Image();>
<an1.src = "persongroß.jpg" style="position: absolute; left: 200px; top: 200px;" ;>
<aus2 = new Image();>
<aus2.src = "personklein.jpg";>
<an2 = new Image();>
<an2.src = "persongroß.jpg" style="position: absolute; left: 200px; top: 600px;";>
<aus3 = new Image();>
<aus3.src = "personklein.jpg";>
<an3 = new Image();>
<an3.src = "persongroß.jpg" style="position: absolute; left: 300px; top: 100px;";>
<aus4 = new Image();>
<aus4.src = "personklein.jpg";>
<an4 = new Image();>
<an4.src = "persongroß.jpg" style="position: absolute; left: 400px; top: 200px;";>
//-->
</script>
<title>
test
</title>
<body>
<img src="personklein.jpg" border="1" style="position: absolute; left: 100px; top: 50px;" alt="20" onmouseover="a1.src='persongroß.jpg';" onmouseout="a1.src='personklein.jpg';" name="a1">
<img src="personklein.jpg" border="1" style="position: absolute; left: 300px; top: 50px;" alt="" onmouseover="a2.src='persongroß.jpg';" onmouseout="a2.src='personklein.jpg';" name="a2">
<img src="personklein.jpg" border="1" style="position: absolute; left: 500px; top: 50px;" alt="" onmouseover="a3.src='persongroß.jpg';" onmouseout="a3.src='personklein.jpg';" name="a3">
<img src="personklein.jpg" border="1" style="position: absolute; left: 700px; top: 50px;" alt="" onmouseover="a4.src='persongroß.jpg';" onmouseout="a4.src='personklein.jpg';" name="a4">
</body>
</head>
</html>
Danke schon im Vorraus!!!
-
Hallo
Ich möchte gerne, dass ein bestimmtes Bild beim Überfahren mit der Maus zu allen Seiten hin gleichmäsig vergrößert wird.
Also das mit dem Mouseovereffekt habe ich ja schon hinbekommen, das Bild wird auch groß, doch die eine Ecke links oben bleibt immer gleich und der rest des Bildes vergrößert sich nach rechts unten.<script language="JavaScript">
<!--
> ~~~javascript <aus1 = new Image();> > <aus1.src = "personklein.jpg";> > <an1 = new Image();> > <an1.src = "persongroß.jpg" style="position: absolute; left: 200px; top: 200px;" ;>...
-->
</script>
Ich kenn' mich ja nicht bis in die hintersten Ecken der JavaScript-Syntax aus, aber bei der Klammerung deiner Anweisungen stellt sich mir doch die Frage "Und das funktioniert?". Überdies fehlt bei `<script>`{:.language-html} die Typangabe (`type="text/javascript"`{:.language-html}). > `<img src="personklein.jpg" border="1" style="position: absolute; left: 100px; top: 50px;" alt="20" onmouseover="a1.src='persongroß.jpg';" onmouseout="a1.src='personklein.jpg';" name="a1">`{:.language-html} Davon abgesehen wird dein Problem mit der exzessiven absoluten Positionierung zu tun haben. Die Angaben zu left und top beziehen sich -oh Wunder- auf die linke obere Ecke. Das ist die, die dir Schwierigkeiten macht. Wenn also onmouseover zutrifft und ein größeres Bild geladen wird, muss die linke obere Ecke auch entsprechend nach links oben verschoben werden. Ob dies dein Code tut, wage ich aber zu bezweifeln (siehe oben). Tschö, Auge -- Die deutschen Interessen werden am Liechtenstein verteidigt. [Veranstaltungsdatenbank Vdb 0.2](http://termindbase.auge8472.de/)