Shulou(Shulou.com)06/01 Report--

Today, the editor will share with you the relevant knowledge points about how html can automatically open a new window. The content is detailed and the logic is clear. I believe most people still know too much about this knowledge, so share this article for your reference. I hope you can get something after reading this article.

Parameter explanation:

Window.open command to pop up a new window

File name of the "page.html" pop-up window

The name of the "newwindow" pop-up window (not the file name). Optional, empty "" can be used instead.

100 window height

Width=400 window width

The pixel value of the top=0 window from the top of the screen

The pixel value of the left=0 window from the left side of the screen

Whether the toolbar is displayed by toolbar=no, or not by yes.

Menubar,scrollbars represents the menu bar and scroll bar.

Whether resizable=no is allowed to change the window size, yes is allowed.

Whether location=no displays the address bar. Yes is allowed.

Whether status=no displays the information in the status bar (usually the file is already open). Yes is allowed.

Second, pop up a full screen window

Join fullscreen

Open the same window as you can see by pressing F11

Join channelmode

Open a window without a title bar (no title, minimum, maximum, and close button)

Look, what's the effect? What if resizable is set to 0 scrollbars=no?

A window that does not maximize the button

In fact, just like the "about us" window of the software, the following is the use of dialogue

Frame window to implement it.

ShowModalDialog () and showModelessDialog ()

1. Use showModalDialog ()

two。 Use showModelessDialog ()

As for the difference between showModalDialog () and showModelessDialog (), the window opened by showModalDialog () (mode window for short) is placed on the parent window and must be closed.

Close to access the parent window (it is recommended to use it as little as possible so as not to be offensive); showModelessDialog ()

(modeless window for short), you can access the window opened by the parent window without having to close it.

Now let me explain some of the parameters here.

DialogHeight: iHeight sets the height of the dialog window.

DialogWidth: iWidth sets the width of the dialog window.

DialogLeft: iXPos sets the left position of the dialog window relative to the upper-left corner of the desktop.

DialogTop: iYPos sets the top position of the dialog window relative to the upper-left corner of the desktop.

Center: {yes | no | 1 | 0} specifies whether to center the dialog box on the desktop. The default value is "yes".

Help: {yes | no | 1 | 0} specifies whether context-sensitive help icons are displayed in the dialog window. The default is "yes".

Resizable: {yes | no | 1 | 0} specifies whether the dialog window size is variable. The default is "no".

Status: {yes | no | 1 | 0} specifies whether the dialog window displays the status bar. The default value is "yes" for modeless dialog windows and "no" for modal dialog windows.

6. Pop up n windows

This is simple, just execute window.open () n times, of course, be sure to give each window a different name, and set left and top to avoid overlap.

After refreshing, the window will no longer pop up

We can just use cookie to control it.

First, add the following code to the area of the main page HTML:

Then, use (note that it's not openwin but loadpop!) Just replace the original sentence on the main page. You can try to refresh the page or re-enter the page, the window will never pop up again.

8. Adapt the pop-up window to the size of the picture inside

Many times we need to provide visitors with this feature: when visitors click on the thumbnail on the page, the corresponding full-size image will be displayed in a new pop-up window for visitors to view.

The easiest way to do this is to create an image link with the following HTML code:

Where the href attribute of the tag specifies that the URL,target property of the full-size picture is set to _ blank to specify that the picture is displayed in a new window; the src attribute of the tag specifies the URL of the thumbnail.

If we want to display the full-size picture of the window appearance of some control (for example, want the pop-up window height, width and the size of the full-size picture to match), you can call the window.open method, which receives three parameters, respectively, specify to open the file URL, window name and window properties, in the window properties parameters can specify the height and width of the window, whether to display the menu bar, toolbar, and so on. The following code displays the full-size picture in a window with no toolbar, address bar, status bar, menu bar, width and height of 400 and 350, respectively.

Here is a question: if all full-size images have a uniform size (for example, 400 × 350), then the above code applies to all thumbnail image links (only the full-size image files pointed to by the href attribute are different). But if the size of the full-size image is not uniform, then we need to get the size of each full-size picture first, and then in the window of the window.open method

One of the characteristic parameters sets height and width to the correct values, which is obviously too inefficient in the case of a large number of images. So is there a way to make the pop-up window automatically adapt to the size of the picture you want to display once and for all? Through the research, it is found that we can use the Image object in DHTML to achieve our purpose. The Image object can dynamically load the specified picture, and the size of the loaded picture can be obtained by reading its width and height properties. In order to set the size of the pop-up window, the pop-up window with adaptive picture size can be realized. The following is the implementation code:

When you use it, put the above code in the tag pair of the web document, and then call the OpenFullSizeWindow function in the click event of the link. The above code passed the test in IE 5.x-6.0.

9. More flexible HTA window

Let me briefly introduce that the full name of HTA is HTML Application, which translates to HTML application, and you just need to use it simply. Hta saves the HTML page for the extension, even if you create a HTA file, let's use HTA to make a window and save the following code as. Hta file, and then open it in your browser.

These are all the contents of the article "how to automatically open a new window in html". Thank you for reading! I believe you will gain a lot after reading this article. The editor will update different knowledge for you every day. If you want to learn more knowledge, please pay attention to the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.