A group of common pop-up window usage Summary

Source: Internet
Author: User

 

A set of common pop-up window usage

The following code sets common pop-up window usage.

1. The most basic pop-up window code

The following is a reference clip:
<Script language = "JavaScript">
<! --
Window. Open ('page.html ')
-->
</SCRIPT>

The code is placed between the <script language = "JavaScript"> tag and </SCRIPT>.
<! -- And --> are used for browsers with lower versions.
Window. Open ('page.html ') is used to control the pop-up window page.html. If page.html is not in the same path as the main window, the path, absolute path (http: //), and relative path (../) should be specified before. You can use single quotes and double quotes, but do not mix them.
This piece of code can be added to any location of HTML, either between

2. After setting, the pop-up window is displayed.

Customize the appearance, size, and position of the pop-up window to adapt to the specific situation of the page.

The following is a reference clip:
<Script language = "JavaScript">
<! --
Window. open ('page.html ', 'newwindow', 'height = 100, width = 400, Top = 0, Left = 0, toolbar = No, menubar = No, scrollbars = No, resizable = No, location = No, status = no ')
// Write a row
-->
</SCRIPT>

Parameter description:
The following is a reference clip:
<Script language = "JavaScript"> the JS script starts;
Window. Open command to pop up a new window;
'Page.html 'name of the pop-up window;
'Newwindow' indicates the name of the pop-up window (not the file name). It is optional and can be replaced by null;
Height = 100 window height;
Width = 400 window width;
Top = the pixel value between the 0 window and the top of the screen;
Left = 0 the pixel value between the window and the left of the screen;
Toolbar = No indicates whether to display the toolbar. Yes indicates display;
Menubar and scrollbars indicate the menu bar and scroll bar.
Resizable = No: whether to change the window size. Yes: Yes;
Location = No indicates whether the address bar is displayed. Yes indicates yes;
Status = No whether to display the information in the status bar (usually the file has been opened), yes is allowed;
</SCRIPT>
End of JS script

3. Function Control pop-up window

Complete code demonstration

The following is a reference clip:
<HTML>
<Head>
<Script language = "JavaScript">
<! --
Function openwin () {window. open ("page.html", "newwindow", "Height = 100, width = 400, toolbar = No, menubar = No, scrollbars = No, resizable = No, location = No, status = No ")
// Write a row
}
// -->
</SCRIPT>
</Head>
<Body onload = "openwin ()">
... Any page content...
</Body>
</Html>

A function openwin () is defined here, and the function content is to open a window. There is no purpose before calling it.
How to call it?
Method 1: <body onload = "openwin ()"> A window pops up when the browser reads the page;
Method 2: <body onUnload = "openwin ()"> A window pops up when the browser leaves the page;
Method 3: call with a connection:
<A href = "#" onclick = "openwin ()"> open a window. </a>
Note: "#" is a virtual connection.
Method 4: call with a button:
<Input type = "button" onclick = "openwin ()" value = "open window">

 

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.