02. The Window Object
The window object represents the current open window on a browser.
Properties
The window object has a slew of properties that can tell you (the programmer) about its properties. Skim through these properties and try clicking on their names to see output in the JavaScript console.
closed- Returns True if window is closed.
defaultStatus- Set the text on the status bar.
innerHeight- The inner height of the page (not including toolbar, other tabs, etc).
innerWidth- The inner width (excludes toolbar, other tabs, etc.).
outerHeight- The outer height of a window (including toolbar, other tabs, etc).
outerWidth- The outer width of a window.
location- Window's current URL.
name- Name of the window.
parent- Used with frames to refer to the window that created a particular window or is one level up from the frame.
parent- Reference to the window that the current window came from.
pageXOffset- The number of pixels user has scrolled horizontally from the upper-left corner of document.
pageYOffset- The number of pixels the user has been scrolled vertically.
screenX- Horizontal coordinate of the window relative to the screen.
screenY- Vertical coordinate of the window relative to the screen.
top- The top-most parent window.
Some properties such as top and parent return a reference to another window object.
Additionally, you can access its child elements - document document, frames, history, andnavigator. We'll cover this in the next lesson.
Methods
window contains a good number of methods. In fact, we have already looked at one of them - alert(), which outputs an popup dialog message to the user.
Some of these methods require a parameters, so Google the methods if you want to see exactly how a method works.
alert()- Opens a popup window. User must click OK to close.
prompt()- Prompts user for an input
open()- Opens new browser window with specified URL.
close()- Closes window.
print()- Opens print dialog.
Moving a window object
There are also functions you can use to move the window object.
moveBy()- Move the window relative.
moveTo()- Moves the window to a specific location.
resizeBy()- Change size of window relative to current size.
resizeTo()- Change size of window to specified size.
Aching back from coding all day?
Inversion Therapy Table
Stretch out your back and relieve your back muscles with inversion therapy. This device counteracts the forces of gravity on the body by decompressing and elongating the spine. By using this product just ten minutes a day, you can be well on your way to improved circulation and posture while relieving muscle aches, back pain and stress.
$$ Check price
(1,700+ reviews) Build modern and responsive webpages
Responsive Typography
Responsive web design helps your site maintain its design integrity on a variety of screen sizes, but how does it affect your typography? With this practical book, graphic designers, web designers, and front-end developers alike will learn the nuts and bolts of how to get the best appearance from type without sacrificing performance on any device.
$ Check price(3+ reviews) Ad