How can we maximize a window?
top.window.resizeTo(screen.availWidth,screen.availHeight);
What is the difference between .parent and .opener?
.parent is used in a frames context where the code in the child frame need to access a variable or invoke a function that was defined in the parent / container frame or document. .opener is used when a pop-up is created via window.open. The code in the pop-up window can access a variable or invoke a function that is defined in the previous window by using the .opener property.
What is the syntax to open a popup window?
var popupWindow = window.open("URL", "popupWindowName" [, "popupWindowFeatures"])
The popupWindowFeatures parameter is optional. It is one string, consisting of a comma-separated list of assignment expression. If you omit this parameter, the popup window has all the toolbars and buttons. If you specify an empty string, the toolbars and buttons are not displayed.
| Attribute | Value | Description |
|---|---|---|
| toolbar | Boolean | "Back", "Forward", and other buttons in the row |
| location | Boolean | The address bar |
| directories | Boolean | "What's New" and other buttons in the row |
| status | Boolean | Status bar at the bottom of the window |
| menubar | Boolean | Menu bar at top of window |
| scrollbars | Boolean | Displays scrollbars if document is larger than window |
| resizable | Boolean | Allow the user to resize the popup window |
| copyhistory | Boolean | Duplicate the Go menu history for the new popup window |
| width | pixelCount | The popup window outer width in pixels |
| height | pixelCount | The popup window outer height in pixels |
Boolean values for true can be either yess, or 1. Boolean value for false can be either no or 0. If you omit any boolean attributes, they are treated as false.
How can we test to see if the popup window was created successfully?
The window.open method returns a reference to the popup window. To test to see if the popup was successfully created:
var popupWindow = window.open("","");
if (popupWindow != null) {
popupWindow.document.write("<html><head><title>Popup Test</title></head><body>Some content</body></html>");
popupWindow.document.close();
}
How can code in the old window manipulate the content or invoke functions in the new popup window?
In the old window, we have:
popupWindow = window.open("URL","popupWindowName","popupWindowFeatures");
if (popupWindow != null) {
...
}
function callFunctionInsidePopup() {
popupWindow.functionName();
}
// After some time has passed, and the popup window is fully loaded
callFunctionInsidePopup();
How can code in the new popup window invoke a function in the old window?
Code inside the new popup window can invoke a function in the old window via the .opener property:
window.opener.functionName();
If we open a new popup window, how can the code in the old window be notified when the new popup window is fully loaded and rendered?
If we have control of the code that is to be loaded into the popup window, we can modify it to use the onload event:
<html>
<head>
<title>...</title>
<script type="text/javascript">
function notifyOpener() {
window.opener.popupLoaded();
}
</script>
</head>
<body onload="notifyOpener();">
...
</body>
</html>
How can we maximize a popup window?
use the screen.availWidth and screen.availHeight properties:
f_open_window_max = function(aURL, aWinName) {
var wOpen;
var sOptions;
sOptions = 'titlebar=0, location=0, status=1, scrollbars=1,resizable=1, menubar=0';
sOptions = sOptions + ',width=' + (screen.availWidth).toString();
sOptions = sOptions + ',height=' + (screen.availHeight).toString();
sOptions = sOptions + ',screenX=0,screenY=0,left=0,top=0';
wOpen = window.open( '', aWinName, sOptions );
wOpen.location = aURL;
wOpen.focus();
wOpen.moveTo( 0, 0 );
wOpen.resizeTo(screen.availWidth,screen.availHeight);
return wOpen;
}
How can we position a popup?
Use the moveTo method.
How can we move the window?
top.moveTo(0,0);
How can we resize the window?
top.resizeTo(screen.availWidth, screen.availHeight);
