Div layer soll ein vergrößertes Bild im selben Fenster anzeigen

[TippEx]

Hallo,

im wesentlichen bereitet mir folgender Abschnitt (selbst ausgedacht, mit bekanntem Erfolg ;) einige Probleme und hoffe, dass sich vielleicht jemand mit etwas mehr Erfahrung den Code mal näher anschauen könnte.

Ziel ist es, eine Vorschau von Fotos zu zeigen.
Mit onmouseover wird die Funktion zoomImg aufgerufen (Übergabeparameter sind die Koordinaten x und y und der Dateipfad).

Die vergrößerte Version vom Foto sollte den Layer-Bereich von der kleineren Darstellung überlappen. Und da eben sagt mir Firefox 3.0 beim Event "onmouseover", dass es nötig ist, für den neuen Layer in der Funktion "zoomImg" auch ein neues Fenster zu öffnen. Und da verstehe ich nicht den Grund.

Weiß jemand einen Tipp vielleicht, wie ich aufgrund eines Maus-Events einen Layer im selben Fenster eröffnen kann ?

Vielen Dank im voraus,

Stephan

-- Anhang Anfang --

[..]
 <script language="JavaScript">

function zoomImg (x,y,pic) {

var x = x+5;
                        var y = y+5;

var zoom = "<img src = "" + pic + "" border = "1">";
   document.write ("<div style = "position:absolute;top:" + y + "px;left:" + x + "px;width:266px;height:312px;z-index:2;">");
    document.write (zoom);
   document.write ("</div>");
  }
 </script>

[..]
<div style = "position:absolute;top:0px;left:348px;z-index:1;">
    <img src= "foto.jpg" width = "91" height = "109.2" border = "1"
         onmouseover="zoomImg (348,0,'foto.jpg')" onmouseout = "zoomImg (348,0,'')">
</div>

-- Anhang Ende --

[Steel]

Hi!

Mit document.write() ueberschreibst Du den Inhalt deines Fensters. Meint dein Firefox vielleicht das?

Ich kann mir auch kaum vorstellen, dass Du fuer jedes Bild ein neues Element einfuegen willst. Sicherlich moechtest Du ein einzelnes Element manipulieren. Oder sollen tatsaechlich mehrere grosse bilder gleichzeitig sichtbar sein?

Spontan wuerde ich empfehlen ein <img> zu platzieren und nur src und und das css fuer die Koordinaten anzupassen.

[TippEx]

Hi Steel

Die Webseite basiert auf PHP.
Die Fotos selbst werden über XML geladen und in einer Schleife ausgegeben (was auch soweit funktioniert). Äh, der Programmcode selbst, den ich da gepostet habe, ist lediglich der Seitenquelltext. :)

Nur wenn ich dann da mit dem Mauszeiger über ein beliebiges Foto spaziere,
springt Mozilla in eine neue Ansicht (Fenster, oder wie auch immer).

Vielleicht kennst du ja diese Previews von www.matton-images.de oder www. photos.com, ohne jetzt für diese Webseiten werben zu wollen ?

;) Die Jungs haben das da aber wohl irgendwie anders gelöst.
Mit dem <div style = "..."> funktioniert das jedenfalls nicht so ganz.

Vielen Dank aber für deine schnelle Antwort..

Schönen Gruß,

Stephabn

Mit document.write() ueberschreibst Du den Inhalt deines Fensters. Meint dein Firefox vielleicht das?

Ich kann mir auch kaum vorstellen, dass Du fuer jedes Bild ein neues Element einfuegen willst. Sicherlich moechtest Du ein einzelnes Element manipulieren. Oder sollen tatsaechlich mehrere grosse bilder gleichzeitig sichtbar sein?

Spontan wuerde ich empfehlen ein <img> zu platzieren und nur src und und das css fuer die Koordinaten anzupassen.

[Steel]

Hi Steel

Die Webseite basiert auf PHP.

Was ja nix mit Javascript zu tun hat, aber trotzdem ganz interessante Info.

Die Fotos selbst werden über XML geladen und in einer Schleife ausgegeben (was auch soweit funktioniert). Äh, der Programmcode selbst, den ich da gepostet habe, ist lediglich der Seitenquelltext. :)

Ich weiss. Is schliesslich JS.

Nur wenn ich dann da mit dem Mauszeiger über ein beliebiges Foto spaziere,
springt Mozilla in eine neue Ansicht (Fenster, oder wie auch immer).

Nochmal: document.write, nach dem Laden des Documents aufgerufen, ueberschreibt Dir Deine Seite. Das willst Du sicherlich nicht benutzen, ausser du arbeitest mit einem neuen Fenster und schreibst dort hinein.

Bevor wir hier anfangen, deine komplette Seite samt Code zu analysieren, (was, denk ich, jetzt sinnvoll waere) mochte ich dir nahelegen mal soetwas wie lightbox auszuprobieren. Nettes Tool. Man muss ja nicht immer das Rad neu erfinden.

Falls Du allerdings selbst schreiben moechtest, wirst Du nicht umhin kommen, hier eine Seite zu verlinken oder etwas mehr Code zu posten. (Betonung auf 'etwas', seitenweise code liest hier niemand.)