View Full Version : Popup Problem(s)

02-22-2007, 08:36 PM
1) Script Title: Popup Window Generator

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex8/popwin.htm

3) Describe problem: It has been brought to my attention that people are not comfortable with the way the popup windows work, and I need a 'nice' solution for two problems.

First problem: The web page has several popups. If the user minimizes the popup, the next time he clicks a link for another popup, the window stays behind the page, it is not refocused, but stays blurred.

The code is this:
var win=null;
function NewWindow(mypage,myname,w,h,scroll,pos){
var TopPosition
var LeftPosition
var settings
else if((pos!="center" && pos!="random") || pos==null){LeftPosition=0;TopPosition=20}
settings='width='+w+',height='+h+',top='+TopPosition+',left='+LeftPosition+',scrollbars='+scroll+',location=no,directories=no,status=no,menubar=no,toolbar=no,re sizable=yes';
win=window.open(mypage,myname,settings);} and a typical call is this:
<a href="someimagereference.jpg" onclick="NewWindow(this.href,'indexpopup','640','480','no','random');return false" onfocus="this.blur()">&nbsp;typical image</a>

The second problem is more difficult to describe. If the user clicks on the image (+ sign in circle), the image gets larger, and the user will expand the window size for the native dimensions, but the image is pushed off to the left and top with black padding on the right and bottom; the complete image does not display. Clicking on the (- in a circle) leaves the image off center and back to the original size. If the user then clicks on the full screen box, the image is still pushed out of bounds, but is correct in a full screen window if the user does NOT use the (+ in a circle) before he expands the window.

Just haven't been able to control this irritable thing, and I've been using it for a long time without complaint until now - it's possible the it is a new browser thing.

02-22-2007, 11:03 PM
For the first problem just add:

. . . else if((pos!="center" && pos!="random") || pos==null){LeftPosition=0;TopPosition=20}
settings='width='+w+',height='+h+',top='+TopPosition+',left='+LeftPosition+',scrollbars='+scroll+',location=no,directories=no,status=no,menubar=no,toolbar=no,re sizable=yes';

You are right about the other problem being harder to describe. I don't really get it and don't see how it has anything to do with this script. Perhaps a link to a demo would help. You might even consider starting a new thread in the javascript forum about that issue, or here if it is a DD script.

02-23-2007, 05:26 PM
That completely solved the first problem. This really should be added to the DD script (Erick's popup generator, link noted above) as a fix for others as well.

Still, the image location problem in the popup window still exists (but only for images in popups smaller than their native size, and where resizing is permitted.) and really needs to be fixed. The script just isn't working right.

In order to get this temporarily solved on a Friday, I had to replace the popup with an imbeded viewer using the DD script for Switch Content. It's really great to have a fantastic tool archive at my fingertips like DD! but I need to undo this when the popup problem is resolved.

02-23-2007, 06:51 PM
I think I get it now. Let's be sure. You are loading an image, not a page as is intended, into the pop up, right?

If I have that correct, once you abandon the layout control that comes with loading a page into a window, you are at the mercy of the vagaries of the different browsers as to how they choose to render images loaded directly into a window.

If you cannot stand this (most browsers do a fair job of of presenting images in this manner, centering them is usually not a part of the process though), you need to load a page into the window. You can do this several ways:

Make a page for each image, one per image.

Have just one page available as a vessel for the images and use javascript or server-side code to load a particular image into that page.

Alter the pop up code to use javascript to create a page 'on the fly' that will contain the image.

Before I go into any of that in more detail, let me know if I have it right - what the problem is and if so, if any of those solutions particularly appeal to you.

02-23-2007, 07:06 PM
Well, nowhere on the script page does it say that you must link only to a html page. Writing a page for each image is a lot of extra work. IMHO the popup should work with any image link.

Anyway, I just reported it as a bug in the DD code and made a working test page at http://earth.engr.ccny.cuny.edu/noaa/wc/Test/PopupTest.htmlso you could see what happens when you resize it to get the larger image. I can't control it anyway, anyhow. See what you think.

02-23-2007, 11:08 PM
Um, what part of 'mypage' didn't you understand. Anyways, the script (actually the script wizard) is intended to generate code to make a pop up window. It does that. Whatever you decide to do with it is up to you and if what you really want is an image viewer, there are many image viewer scripts out there. Almost all of them do not involve pop up windows. That is because the pop up window isn't all that well suited to image viewing. Pop up windows in general always have the liability that they may be blocked and there is no graceful fall back under those circumstances.

With all of that said, they can be used for image viewing as long as you are willing to accept the part about them being blocked sometimes. To use them for image viewing and to have the interface be elegant does require more code than a simple pop up window.

I think lightbox (http://www.dynamicdrive.com/dynamicindex4/lightbox2/index.htm) or thumbnail viewer (http://www.dynamicdrive.com/dynamicindex4/thumbnail.htm) here at DD are both better choices in many ways. Before these two scripts were available I did use Erik King's code to make my own viewer but it required extensive modification to work out the way I wanted it to.

Here's a page that still uses the viewer I made:


Perhaps by viewing the source code, you can get the ideas you need to make your own perform the way that you would like it to.