Managing JavaScript "popup" windows
When you use the JavaScript window.open method to open a new browser window you may experience problems when you try to re-use it.
For example, open the link below and then click back inside this window so that the new one goes behind it.
window.open('/icons/vwicn001.gif', 'SampleWindow1', 'WIDTH=300,HEIGHT=250');
This has opened a new instance of the browser called 'newWindow'.
Now click on the above link again. The link does not open a new window as expected. That is because a window with that name ('newWindow') already exists. The link is actually working, you just can't see it.
This method is fine if your users are wise enough to know that they need to toggle back to the new window using the "task-bar" or similar method. But, most users will end up confused and annoyed after clicking the link a dozen times expecting it to appeat in front of them.
The solution is to use the following customised function in the place of the window.open method that checks to see whether or not a window of that name is already open. If so, then it will call focus on it so that it is returned to the foreground.
Note: It is a good idea to make this function available globally and to then always use it in place of the window.open method (it accepts exactly the same arguments).
function windowOpener(url, name, args) {
if (typeof(popupWin) != "object"){
popupWin = window.open(url,name,args);
} else {
if (!popupWin.closed){
popupWin.location.href = url;
} else {
popupWin = window.open(url, name,args);
}
}
popupWin.focus();
}
Proof of the pudding:
Clink the link below and then return to this window.
windowOpener('/icons/vwicn002.gif', 'SampleWindow2', 'WIDTH=300,HEIGHT=250');
Now click the above link again. It should come back in to view.....
What is the above function doing?
The first thing it does is to see if it has already been run by checking for a variable called 'popupWin'. If it is the first time then this variable is set to an object variable by opening a new window. If the window still exists then its attributes are reset else a new window is opened. The final thing to do is focus on said window.
Note: If you try and use the same function to open another window e.g. like the link below:
windowOpener('/icons/vwicn003.gif', 'SampleWindow3', 'WIDTH=600,HEIGHT=150');
The popupWin object will still be holding reference to the first window so this will get re-used. Not only this but it won't open using the parameters specified in the newer link. If you need to open multiple different windows then use this function instead:
popupWins = new Array();
function windowOpener(url, name, args) {
/*******************************
the popupWins array stores an object reference for
each separate window that is called, based upon
the name attribute that is supplied as an argument
*******************************/
if ( typeof( popupWins[name] ) != "object" ){
popupWins[name] = window.open(url,name,args);
} else {
if (!popupWins[name].closed){
popupWins[name].location.href = url;
} else {
popupWins[name] = window.open(url, name,args);
}
}
popupWins[name].focus();
}
The popupWins array is defined outside the function, making it global. This is done so that it doesn't get redefined each time the function is called, losing references to previous windows.
;){kind=link}
;){kind=link}
;){kind=link}
Closing Windows
Is there a way to automaticly close a pop up window or any window for that matter after a period of time?
Reply
Re: Closing Windows
Try this link for closing windows using a timer. http://javascript.internet.com/navigation/close-window.html
Reply
Show the rest of this thread
Not the same a window.open
these functions are not quite the same as window.open. window.open returns a handle to the window. To make these funtions the same you need to add the following line at the end of the function; "return popupWins;" to the first function, or "return popupWins[name];" to the second.
Otherwise i love it!
Reply
simplified windowOpener()
First windowOpener() can be simplified with the same functionality as follows:
function windowOpener(url, name, args) {
if(typeof(popupWin) != "object" || popupWin.closed) { popupWin = window.open(url,name,args); } else { popupWin.location.href = url; }
popupWin.focus(); }
Reply
Controlling the menbars of popup windows
Hi, I'm utilizing your script very successfully (see http://www.arttoharmony.com/MysticalReflections.htm). When the popup windows popup, we would like to take away all menu bar and other capability from it, as we don't want anyone taking my aunt's pictures. I saw some other code that does this, but I don't know how to apend your code to do that. Can anyone help, please?
many thanks!
Gary
__________ this is the kind of stuff I want to add: onClick="window.open('myimage.gif', 'myWin', 'toolbar=no, directories=no, location=no, status=yes, menubar=no, resizable=no, scrollbars=no,
Reply
Another - much easier way:
If you want to reuse a window and make sure it is not in the background after changing the content, just call .focus() on it.
Example: popup = window.open("someURL.html", "myPopup"); popup.focus();
Reply
Re: Managing Javascript "pop up" windows
I'm a newbie to Javascript, and have got the code shown here to work okay if I click the link, view the picture and then select the 'close window' link that I have provided. So far, so good.
However, the pictures I need to display are all different sizes, so I would still want the focus to return to the pop up window (if it's been left open), but I want it re-sized to match the size that I specify in the javascript link for each picture.
The code here fails to reize the window to match the specified size (width, height) of the new graphic.
Any ideas?
Reply
Re: Managing Javascript "pop up" windows
Richard,
Try setting the width and height property of popupWin after you've opened the new page in it. i.e:
popupWin.open(...); popupWin.width=XXX; popupWin.height=XXX;
HTH Jake
Reply
Show the rest of this thread
Re: Managing Javascript
function windowOpener(url, name, args) { if (typeof(popupWin) != "object"){ popupWin = window.open(url,name,args); } else { if (!popupWin.closed){ popupWin.location.href = url;
} else { popupWin = window.open(url, name,args); } } popupWin.focus(); }
// called from html - closes popup then reopens with new args function popWindow1() { if (typeof(popupWin) == "object") popupWin.close() windowOpener(url1, name1, args1) }
// called from html - closes popup then reopens with new args function popWindow2() { if (typeof(popupWin) == "object") popupWin.close() windowOpener(url2, name2, args2) }
Reply
Question? window.close()
I am using the following code to open a form within a LS agent to open a second window.
Print "<Script Language='JavaScript'>" Print "window.open('storeform?OpenForm')" Print "setTimeout(window.close, 1000)" Print "</Script>"
When I close the first window the user is prompted that the code is closing the window. Is there a way from having this prompt show up for the user?
Thanks for any help offered!!!!
Reply
Re: Question? window.close()
Which window are you trying to close? The one you opened or the one that opened it?
You can only close windows with JavaScript if they were created/opened/spawned by JavaScript in the first place.
So, the one you open can be closed but the one underneath can't. If you want to close the window you opened you need to give it a name to refer to it by. See main article for how.
Reply
Show the rest of this thread
Bookmarks
windowOpener function will not jump to bookmarks on popup window. Is there a way to avoid this?
Reply
Java window open help
Sure hope you or someone can help me. Using IE6 and the latest Java, I can't get any window to open up when I click on the link on numerous sites, including the code you have in this article. The Status Bar just says Error on Page. I think it's a Java problem, but I installed an older (v1.2) Java, and it wasn't fixed. Occasionally, a window will open, but it has to be a regular html page, and not Java. Though, sometimes, the regular pages won't open either. Sorry if this is off topic, but I have been searching for weeks, and I can't find anyone who knows what's going on. Please help.
Reply
Re: Java window open help
I'll answer my own question. Don't know if anyone cares, but the problem was with Windows Service Pack 2, and it was solved when I uninstalled it.
Reply
Show the rest of this thread
undesired refresh
Although the code brings focus to the desired window...it is also refreshing the window and causing me to lose any information that I had in the fields. Is there a way to stop it from refreshing?
Reply
My solution to undesired refresh
What I have done to avoid the undesired refresh:
function windowOpener(url, name, args) { if(typeof(popupWin) != "object" || popupWin.closed) { popupWin = window.open(url,name,args); } else { if (name!=popupWin.name){ popupWin.close(); popupWin = window.open(url,name,args); } } popupWin.focus(); return popupWin; }
Reply
Dead object window
after clicking on a link using javascript to set the size and parameters of my new window, I get a new window opening that THEN spawns the correct window with the appropriate page loaded. But the other window just says open (it has the word "object" in it, but nothing else, and the url for that page is my javascript). What am I doing wrong?
Reply
Re: Dead object window
Sounds like you need to wrap all your code inside a void operator. Like so:
JavaScript:void(code)
Reply
How to make the popup window as modal
when the popup window is opened it is possible to return to the parent window
How to return to the parent window only after closing the popup window
we should not perform other operations unless it is closed
please reply me to the mail id
Reply
Re: How to make the popup window as modal
Plz let me also know the solution
Reply
Show the rest of this thread
finding root of my application on the server
i want to know about relative url in javascript . i want to open a new window . my current url is : http://1and2/test/test2/default.aspx
and i want to open this url : http://1and2/test/test3/index.html
location.host returns 1and2 . and i dont know in which directory my application is running on the server . ( /test or /test/test3 or something else ) how can i find the root of my application url in javascript ?
Reply
Append windowOpener with code to Center Pop Up
Thanks for the great script. It works beautifully. The only change that I would like is to append the code to automatically "center" the Pop Up window according to the size of the users resolution.
Does anyone know how to append the code to do this?
Thank you. Thank you. Thank you!
Reply
Feedback
Hey Jake, thats wonderful, terrific and amazing, Its really cool and very useful
Reply
not working in Safari
But this code is not working in safari. the the child window is not getting the focus when i click on the link
Reply
safari have a hidden error and stopping the focus and resize function after window is opened and if you use your mouse to pull it bigger it make a jump to what you have set it to try it your self but no solution to that problem and it is safari there have to make that error.
You can do it in safari but you have to set the width and the height when you make the window in safari and not after you have made the window.
<script language="javaScript" type="text/javascript"><!--
var up=true;
function MiniRadio(content){
if(up){
name= window.open("+content+","name", config='toolbar=0, location=0, directories=0, status=0, menubar=0, scrollbars=0, resizable=0, copyhistory=0, left=0, top=0, width=312, height=220');
name.moveTo(0,0);
up=false;
}else{
if(false==name.closed){
name.close();
up=true;
}else{
name= window.open("+content+","name", config='toolbar=0, location=0, directories=0, status=0, menubar=0, scrollbars=0, resizable=0, copyhistory=0, left=0, top=0, width=312, height=220');
name.moveTo(0,0);
up=false;
}
}
}
//--></script>
this script open a window then you click on the link there you have to use it and then you click again it closes the window or if you have refreshed the main window after you have made the window it will only refresh the window and you have to click again to close the window.
Reply
launching window.open from a client
Hi Jake,
I was wondering if you could help. I have a bit of code that sends an email to a notes client with a hotspot link that contains a window.open : eg. javascript:window.open("whatever.nsf/...editdocument","","toolbar=no")
For some reason, the parameter for hiding the toolbar is ignored (or any other parameter i decide to use).
Any help would be much appreciated.
Reply
Managing JavaScript "popup" windows is very useful.
It's working for me for all browsers.
Thanks,
Parthu
Reply
Hi Jake, I have a need to open multiple windows in my JS where a foreach loop is used for opening multiple html documents. However, when the windowOpener function is called in this way only a single window is opened, even though I provide a name parameter with unique names for each window. The single window contains all of the documents that can be displayed by hitting the backpage key on the browser, but what I really want is to display each document in a separate window. Any thoughts on this? Thanks.
Reply
Hi Bob,
This article is getting on for 10 years old now. Things have changed and I don't know what the best practice is now for opening multiple windows. Times have changed and any JS that try to open windows using a for loop might well be blocked by modern browsers trying to prevent any malware/virus or malicious script kiddies etc.
Jake
Reply
This does not seam to work in chrome :-( ..
Reply
Nothing is working in Chrome loser browser from Google. And if you get it to work in google it dosent work ind the other browser, ironic. my solution is make a html document for each browser. Not a solution, but it works.
Reply