View Full Version : Preloading problem with Netscape

03-18-2004, 03:46 AM
I've got a weird preloading problem with Netscape. I use the following code to preload an image and store its dimensions so I can open a popup window that matches its size. The problem is the first time i click on a link to run the script it returns the height and width of 0. If I click again it retrieves the correct image size. In IE it seems to work fine. Whats going on?

var iObj = new Image(); iObj.src = iurl; //load image
var iW = iObj.width; var iH = iObj.height; // store image size
if(iW<100){iW = 100}; if(iH<100){iH = 100};
var iWin = window.open('','','height='+iH+',width='+iW+',top=100,left=100'); //open window to correct size

Here the actual script:

03-18-2004, 04:13 AM
You must wait for the image to load completely before getting its dimensions. The image has onload event that triggers when the image has completely loaded. You may want to check the "Popup image viewer" link in my sig. I think it's what you need.

03-18-2004, 06:14 AM
thx glenngv i first used a script similar to the one you pointed me to but i didn't like the effect where the window is displayed and then you see it resized. Someone else showed me the current script I'm using. I was impressed by how much simpler the code was and how it sized the window before displaying (much more elegant method). Only when i put it up on a test server did i discover the preload problem.

Its funny when you look at someone elses script you say god thats a real ugly, long way of doing a simple task. Only after you've tried unsucessfully to streamline it you figure out why the programmer wrote it that way.

One last thing, I found it interesting the way you were able to resize the window correctly. In other popup scripts they use Navigator/IE test to compensate for the different way each browser measures window size. I'm curious how your script works without such a test?

Another quick thought, I've don't see resize script used on most mainstream sites. They must either have a serverside solution or hardcode their popup window size.

03-18-2004, 07:07 AM
If you really want to use the original script, then you should modify it to put an onload handler.

function ResizedWinImage(iurl){
var iObj = new Image();
//assign onload handler before setting the src
iObj.onload = function(){
var iW=this.width;var iH=this.height;
if(iW<100){iW = 100}; if(iH<100){iH = 100}; //insure the window in no smaller than 100x100
var iWin = window.open('', '', 'height='+iH+',width='+iW+',top=100,left=100, location=no, menubar=no, status=no, toolbar=no, scrollbars=no, resizable=no'); //open new window and set its features
with(iWin.document){ //shortens writeln method
//write html to new window to: insert image and script to close window
writeln('<body onload="self.focus()" onblur="self.close()">');
writeln('<img src='+this.src+'>');
close(); //tell browswer were finished writing html to window

iObj.src = iurl; //create image object with url passed in

The problem with this way is that if the image's size is big and takes a while to load, the user would see no window popping up and would thought that nothing is working. Unlike in my suggested script in my sig that displays a "Loading..." message as the image is being loaded.