[thelist] JS/DOM: Image doesn't load in remote window

Sarah Sweeney mr.sanders at designshift.com
Thu Jul 15 09:14:18 CDT 2004


> I have a page containing a table full of images. One image per cell. 
> Each  cell calls the following function as such.
> 
>         <td onclick="propImgView(this);">
> 
> I can certainly load just the image in a new window, but I want some 
> HTML to format things a bit, remove padding and margins in the window.
> 
> The function retrieves the image properties (they are full 640x480 
> images resized by the browser --I know not good). It then opens a new 
> window, and should create an image object and assign it the same source 
> as the one retrieved from the table cell (view 'larger' image).
> 
> For some reason, though, I can't seem to get the bugger to display. 
> Using alert() I know that the src is correct, and it's a full url, not 
> relative.  The remote document contains the skeleton of an html page. No 
> content in the body (not even a space). It does include meta tags, and 
> styles, but that should be irrelevant.
> 
> I keep going over this and can't figure out where my error might be. Can 
> someone spot it?

I can't guarantee this will fix your problem, but when performing action 
between a popup and the opener, due to security restrictions, I don't 
think you can change variables between the windows. So if you want Page 
A to open Page B and then do some things in Page B, you will have to 
create a function in Page B to do those things, and simply call the 
function from Page A. Something like this:

===========
//this function goes in Page A
function propImgView(obj) {
   // Get the source
   image = obj.childNodes.item(0).src

   // Make, open and load the window
   win_props = 'toolbar=no,location=no,directories=no,status=no,' + 
'menubar=no,scrollbars=no,resizable=yes,width=640,height=480,top=25,left=25';

   remote = 
window.open("../properties/property_popup.html",'remote',win_props);

   remote.addImage(image);
}

//this function goes in Page B
function addImage(image)
   // Create an image object in the remote window, set it's id and source
   r = document.createElement("img");
   r.setAttribute("src",image);
   r.setAttribute("id","full_image");

   // Append it to the remote window's body
   b = document.getElementsByTagName("body").item(0);
   b.appendChild(r);  // IE chokes on this. Why? Is this my problem with 
FireFox too?

   // Test
   alert(b.innerHTML)
}
===========

HTH

-- 
Sarah Sweeney
Web Developer & Programmer
Portfolio :: http://sarah.designshift.com
Blog, etc :: http://hardedge.ca


More information about the thelist mailing list