Summary of methods for manipulating windows with JavaScript

Summary of methods for manipulating windows with JavaScript_javascript skills

WBOY

Release： 2016-05-16 17:31:01

Original

1068 people have browsed it

In the previous introduction, we discussed the close() method:

Copy the code The code is as follows:

 win = window.open("http://www.jb51.net/", "js"); 
 win.close(); 

JavaScript provides There are many methods and properties that we can use to control windows.
Moving, scrolling and resizing
The following methods (N4, IE4) are responsible for moving, scrolling and resizing operations of a specific window:

Copy code The code is as follows:

 // Move the screen position of the window to the specified offset x, y (absolute movement) 
 window.moveTo (iX, iY ) 
 // Move the screen position of the window to the specified offset x, y (relative movement) 
 window.moveBy(iX, iY) 
 // Move the screen position of the scroll window to the specified offset x , y (absolute scrolling) 
 window.scrollTo (iX, iY) 
 // Scroll the screen position of the window to the specified offset x, y (relative scrolling) 
 window.scrollBy (iX, iY) 
 // Change the window size to the specified height and width (absolute size change) 
 window.resizeTo(iWidth, iHeight) 
 // Change the window size to the specified height and width (relative size change) 
 Window.resizeBy (iX, iY) 

Note that these methods all belong to the window object, so they are intelligently executed in the current window or other windows that can be referenced. If you want to dynamically set the position and size of the window, you can use the move and resize methods after the window is created.
//form
Note that it is not possible to control a window that contains pages from other servers.
Maximize the window
We will now introduce how to make a button that can maximize the window when clicked.
Let’s take a look at the HTML and JavaScript code for this button:

Copy the code The code is as follows:

Note that the resizeTo() method refers to the size of the entire window. //form
A floating advertisement
On the website, by moving the advertisement window, it can attract the viewer's attention. We can achieve the effect of moving the window left and right by calling the following function:

Copy the code The code is as follows:

　function makeAd() {
　window.open("adpage.html", "ad", "width=468,innerWidth=468,height=80,innerHeight=80,left=0,top=0 "); 
　}

The following is the code of the page adpage.html:

Copy code The code is as follows:

When the page adpage.html is loaded, the function startAD() is executed. The window can only be moved if the user's browser supports the window.screen object, because we need to use window.screen to calculate the width of the screen. The window slides on the upper border of the screen, from the upper left corner (pos=0) to the upper right corner.
Move the advertising window 5 pixels every 50 milliseconds through the built-in setInterval() function. If the "stop" button is clicked, the following will be executed