The window object is created for each window that appears on the screen. A window can be the main browser window, a frame set or iframe, or even a new window created with JavaScript (pop-up).
The properties and methods of the window object gives you some control over browser windows.

Window Object Properties

- Examples with some of these properties
1) Displays an Alert with the Width and Height of the curent window (works only in Firefox).
<script type="text/javascript"><!--
var v_width = window.innerWidth;
var v_height = window.innerHeight;
alert("width = "+ v_width+ " | Height = "+ v_height);       // width = 1280 | Height = 649

2) Sets a name to the window and writes it in the page.
<script type="text/javascript"><!-- = "Test_Win";
document.write("This window is named ";     // This window is named Test_Win

3) When is clicked a button (Open new Win), it calls a function that opens a new window (pop-up), writes a text inside it and also writes another text in the opener window.
<script type="text/javascript"><!--
function openWin() {
  var new_win ='','new_win','width=280,height=100');

  // writes a text in the current (opened) window
  new_win.document.write("This is 'new_win'");

  // Writes a text in the parent (opener) window
  new_win.opener.document.write("<p>This is the opener window!</p>");
<button onclick="openWin()">Open new Win</button>

4) When is clicked a button (Gets Win position), it calls a function that gets the X,Y position of the window, using the properties according to the browser, and displays a message with the X,Y position.
<script type="text/javascript"><!--
function getPosition() {
  var browser_n = navigator.appName;     // gets the browser

  // gets the x,y screen position accordint to browser
  if (browser_n=='Microsoft Internet Explorer') {
    var x = window.screenLeft;
    var y = window.screenTop;
  else {
    var x = window.screenX;
    var y = window.screenY;

  alert('position X = '+ x+ ' position Y = '+ y);
<button onclick="getPosition()">Gets Win position</button>
- You can test with the next button.

Window Object Methods

- Examples with some of these methods:
1) A button that calls a function that moves the window by 20 pixels horizontally and 8 pixels vertically.
- In Firefox, if the window is the maximum size (maximize), first will resize it.
<script type="text/javascript"><!--
function moveWin() {
  window.moveBy(20,8);     // move the window
<button onclick="moveWin()">Move Win</button>
- You can test by clicking the fallowing button:

2) A button that calls a function that resizes the window to width 550 pixels and height 400 pixels.
<script type="text/javascript"><!--
function resizeWin() {
  window.resizeTo(550, 400);     // resize the window
<button onclick="resizeWin()">Resize Win</button>
- You can test by clicking the fallowing button:

3) A button that calls a function that scrolls the window vertically, 50 pixels at each click.
<script type="text/javascript"><!--
function scrollWin() {
  window.scrollBy(0, -50);     // scrolls the window
<button onclick="scrollWin()">Scroll Win</button>
- You can test by clicking the fallowing button:

4) Creates a button that calls a function that opens an URL (received as parameter) in a new window, with height=600 pixels and width=800 pixels.
<script type="text/javascript"><!--
function openWin(url) {,'new_win','width=800,height=600');     // open new window
<button onclick="openWin('')">Open new Win</button>
- This example will display the fallowing button:

Daily Test with Code Example

Which tag is used to add definition lists into a <dl> element?
<dt> <dd> <li>
  <dd> - Hyper Text Markup Language</dd>
  <dd> - Language for web pages</dd>
Which CSS property can hide an element on page, letting an empty space in its place?
display position visibility
#id {
  visibility: hidden;
Click on the event which is triggered when the mouse clicks on an object.
onclick onmouseover onfocus
document.getElementById("id").onclick = function(){
Indicate the PHP variable that contains the contents of both $_GET, $_POST, and $_COOKIE arrays.
if(isset($_REQUEST["id"])) {
  echo $_REQUEST["id"];
Window Object

Last accessed pages

  1. Courses Web: PHP-MySQL JavaScript Ajax HTML CSS Flash-AS3 (71506)
  2. Node.js Move and Copy file (3515)
  3. PHP-MySQL Scripts (3745)
  4. PHP getElementById and getElementsByTagName (19140)
  5. Redirects (503)

Popular pages this month

  1. Read Excel file data in PHP - PhpExcelReader (443)
  2. PhpSpreadsheet - Read, Write Excel and LibreOffice Calc files (351)
  3. Register and show online users and visitors (319)
  4. Courses Web: PHP-MySQL JavaScript Ajax HTML CSS Flash-AS3 (301)
  5. Insert, Select and Update NULL value in MySQL (214)