JavaScript and windows

Objectives

open new windows using JavaScript
write content to a different window using JavaScript
modify window properties using JavaScript
resize and move windows using JavaScript

Opening windows

please note that with new security features in browsers, some of these techniques may no longer work depending on settings
please note that in new browsers with tabs opening a new window may just open a new tab - so the features string sent to window.open may be ignored; in any case, that string is non-standard between browsers
see windows/window1.html
opening a window without using JavaScript: <a href="page2w.html" target="mywin">
opening a window with JavaScript: window.open(url, name, features, replace)
the window.open function returns a reference to the window which you should keep if you want to interact with that window again
whatever name you give a window when you create it is the name you can use to target a link to (just like with frames)
send a window to the top: window.focus()
you can check to see if a window named win exists: if (win)
you can check to see if the window named win is closed: if (win.closed)

you can open a window and fill it dynamically

var winx = window.open("", "_blank");
winx.document.writeln('<html><head><title><\/title><\/head>');
winx.document.writeln('<body><p>Hello, world!</p><\/body><\/html>');
winx.document.close();

change the contents of a window: if (win) win.location.replace('page3w.html');
you can open multiple windows if desired
See the reference at mozilla.org: https://developer.mozilla.org/En/DOM:window.open

Interacting with a parent window

change it: opener.location.href = 'page1w.html';
close it: opener.close();

setInterval function

we have used setTimeout to time the next call of a function
setTimeout returns a value that can later be passed to clearTimeout to stop the trigger
there is also setInterval which will set a recurring trigger to call a function
setInterval returns a value that can later be passed to clearInterval to stop the trigger
use setInterval to trigger a function every second: onload="setInterval('trouble()', 1000);"
let's hope you have popup windows blocked if you are on page window2.html and that function is: window.open('window2.html', '_blank');
see windows/window2.html

Moving and resizing a window

JavaScript usually restricts the minimum size you can make a window (for security reasons)
resize a window to given dimensions: window.resizeTo(width, height);
move a window to a given position: window.moveTo(x, y);
get screen width: screen.width
get screen height: screen.height
resize a window by a relative amount: window.resizeBy(diffx, diffy);
move a window by a relative amount: window.moveBy(diffx, diffy);
print a window: window.print();
see windows/window3.html

Setting window properties

you can set all kinds of properties of a window when you open it
- width
- height
- left/screenX
- top/screenY
- location
- menubar
- resizable
- status
- toolbar
- scrollbars
see windows/window4.html

source for above demonstration page:

<script type="text/javascript">
function open1() {
   s = "width=500,height=150,left=0,screenX=0,";
   s += "top=100,screenY=100,location,menubar,";
   s += "resizable,status,toolbar";
   window.open("page1w.html","_blank",s);
}

function open2() {
   s = "width=300,height=500,left=300,screenX=300,";
   s += "top=0,screenY=0";
   window.open("page1w.html","_blank",s);
}
</script>
<p><a href="javascript:void open1();">Open first window</a></p>
<p><a href="javascript:void open2();">Open second window</a></p>