IE Problem mit window.resizeTo
Umbratus
- javascript
Hallo Leute,
mit unten stehendem Code erzeuge ich dynamisch ein Fenster um Bilder
vergrößert anzuzeigen. Die größe des Fensters wird dabei an die Größe des Bildes
angepasst.
Keine Probleme mit Netscape4, Opera.... leider passiert es im IE5 und IE6
manchmal (beim ersten Öffnen eines Bildes?!?), dass die Größe des Fensters
nicht eingestellt wird.
Weiss da jemand rat?
Das Skript MUSS mit NS4 lauffähig sein.
Bitte auch keine Browserschiene.
Danke
Umbratus
var picwin;
// Bild in neuem Fenster öffnen
//************************************************
// Parameter : Pfad des zu öffnenden Bildes
// Bildtitel optional
//
function open_picture(path,titel)
{
//Wenn Pfad übergeben...
if(path)
{
//Hintergrundfarbe HIER einstellen
var bgcolor="#FFFFFF";
//Variable für Bild
var pic = new Image;
pic.src = path;
// Bildtitel aus Bildquelle extrahieren falls kein Titel angegeben
if(!titel)
for(var i=pic.src.length ; i>=0 ; i--)
{
// Schleife bis Backslash
if(pic.src.substring(i-1,i) == "/")
{
// Dateiname vom Pfad abschneiden (Dateiendung weglassen)
titel = pic.src.slice(i,pic.src.length-4);
break;
}
}
//neues Fenster öffnen
picwin = open("","picwin","width=100,height=100,resizable=yes,status=no,toolbar=no,menubar=no,location=no,scrollbars=no");
//html Code dynamisch einbinden
picwin.document.open("text/html","replace");
picwin.document.writeln("<html>\n<head>");
picwin.document.writeln("<title>"+titel+"</title>");
picwin.document.writeln("</head>");
picwin.document.writeln("<body bgcolor="+"'"+bgcolor+"'");
picwin.document.writeln("<div align='center'><img src="+"'"+pic.src+"'"+" hspace='0' vspace='0'></div>");
picwin.document.writeln("<div align='center'><form><input type='button' name='Button' value='Schließen'
onClick='window.close();'></form></div>");
picwin.document.write("</body>\n</html>");
picwin.document.close();
// Fenster auf Grösse des Bildes anpassen und positionieren
picwin.resizeTo(pic.width+30,pic.height+90);
picwin.moveTo((screen.width-pic.width-20)/2,(screen.height-pic.height-20)/2);
// Fokus auf das Bildfenster
picwin.focus();
}
}
Hallo Umbratus,
Keine Probleme mit Netscape4, Opera.... leider passiert es im IE5 und IE6
manchmal (beim ersten Öffnen eines Bildes?!?), dass die Größe des Fensters
nicht eingestellt wird.
Das ist logisch, denn...
var pic = new Image;
pic.src = path;
...hiermit initiierst du den HTTP-Request. Der Browser bezieht also das Bild vom Server, das dauert einige Zeit.
picwin.resizeTo(pic.width+30,pic.height+90);
Zehntelsekunden später, nachdem das Fenster geöffnet wurde, fragst du bereits die Eigenschaften des Objektes ab. Das Bild ist aber unter Umständen noch längst nicht fertig geladen. Deshalb sind diese Eigenschaften zunächst einmal 0 (Null). Erst wenn das Bild fertig geladen ist (http://selfhtml.teamone.de/javascript/objekte/images.htm#complete), enthalten sie die tatsächlichen Werte. Zum Zeitpunkt des Resize ist aber das Bild in einigen Fällen noch nicht vollständig vom Server bezogen, sodass picwim.resizeTo(0+30, 0+90) ausgeführt wird.
Du musst also vor dem Resize sicher sein, dass das Bild geladen wurde. Dies lässt sich beispielsweise über die genannte Eigenschaft complete abfragen. Da hier aber eine leere while-Schleife (»tu nichts, bis die Grafik geladen ist«) oder eine sich immer wieder aufrufende Funktion (setTimeout) vermutlich unpassend wären, kannst du den onload-Event des Dokuments nutzen, welches du in das Fenster schreibst. Struppi hat es beispielsweise so gelöst: http://home.arcor.de/struebig/js/popup/. Bitte beachte auch, dass es nicht möglich ist, die Fenstergröße exakt an das Bild anzupassen, weil die Browser die Länge und Breite anders interpretieren.
Mathias
Hallo Mathias
Vielen Dank für deinen Tipp, was ähnliches hab ich vermutet.
Das die Fenstergröße nicht auf jedem Browser exakt stimmt weiss ich.
Ich werd gleich mal nen Timeout implementieren.
1000 Dank, hast mir echt geholfen, hab schon garnicht mehr mit einer Antwort gerechnet.
Gruß Umbratus