Full analysis of window.open functions_Basic knowledge
WBOY
Release: 2016-05-16 19:25:19
Original
1207 people have browsed it
[1. The most basic pop-up window code] In fact, the code is very simple:
Because it is a piece of javascripts code, they should be placed between . works on some older browsers. In these older browsers
the code in the tag will not be displayed as text. Develop this good habit. window.open ('page.html') is used to control the pop-up of a new window page.html. If page.html
is not in the same path as the main window, the path should be written in front, absolutely Both path (http://) and relative path (..
/) are acceptable.
You can use either single quotes or double quotes, just don’t mix them. This piece of code can be added anywhere in the HTML. It can be between and , or between and
ody>. The earlier the code is, the earlier it will be executed, especially on the page. The code is long, and if you want the page to pop up earlier, try to put it in front of
.
【2. Pop-up window after setting】 Let’s talk about the settings of pop-up window. Just add a little more to the code above.
Let’s customize the appearance, size, and pop-up position of this pop-up window to suit the specific
situation of the page.
Parameter explanation:
End of js script [3. Use functions to control pop-up windows] The following is a complete code.
...Any page content...
A function openwin() is defined here, and the function content is to open a window. There is no any use before calling it. How to call it? Method 1: Pop-up window when the browser reads the page; Method 2: Pop-up window when the browser leaves the page; Method 3: Call with a connection: Open a Window Note: The "#" used is a virtual connection. Method 4: Use a button to call:
[4. Pop up 2 windows at the same time] Slightly change the source code:
To prevent the two pop-up windows from covering each other, use top and left to control the pop-up position so that they do not cover each other
. Finally, you can call it using the four methods mentioned above. Note: The names of the two windows (newwindows and newwindow2) should not be the same, or they should all be empty. OK?
[5. Open the file 1.htm in the main window and pop up the small window page.html at the same time] The following code is added to the main window area:
Join the area: open.
[6. Timing closing control of pop-up windows] Now we can control the pop-up windows, and the effect will be better. If we add a small piece of code to the pop-up page (note that it is added to the HTML of page.html, not the main page, otherwise ...), let it 10 Wouldn’t it be cooler to automatically shut down after seconds? First, add the following code to the area of the page.html file:
Then, use the sentence , and then close the window automatically after 10 seconds.)
【7. In Add a close button to the pop-up window]
Haha, it’s even more perfect now! [8. Pop-up windows included - two windows on one page]
The above examples all contain two windows, one is the main window and the other is a small pop-up window. Through the following example, you can complete the above effect in one page.
Open a window
<script> <BR><!-- <BR>window.open ('page.html') <BR>--> <BR></script> <script><br>ipt">标签和</script><script> <BR><!-- <BR>window.open ('page.html', 'newwindow', 'height=100, width=400, top=0, <br><br>left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=n <br><br>o, status=no') <BR>//写成一行 <BR>--> <BR></script> <script> js脚本开始; <BR>window.open 弹出新窗口的命令; <BR>'page.html' 弹出窗口的文件名; <BR>'newwindow' 弹出窗口的名字(不是文件名),非必须,可用空''代替; <BR>height=100 窗口高度; <BR>width=400 窗口宽度; <BR>top=0 窗口距离屏幕上方的象素值; <BR>left=0 窗口距离屏幕左侧的象素值; <BR>toolbar=no 是否显示工具栏,yes为显示; <BR>menubar,scrollbars 表示菜单栏和滚动栏。 <BR>resizable=no 是否允许改变窗口大小,yes为允许; <BR>location=no 是否显示地址栏,yes为允许; <BR>status=no 是否显示状态栏内的信息(通常是文件已经打开),yes为允许; <br><br><BR></script><script> <BR><!-- <BR>function openwin() { <BR>window.open ("page.html", "newwindow", "height=100, width=400, toolbar <br><br>=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no") <br><br><BR>//写成一行 <BR>} <BR>//--> <BR></script>Look at the code in OpenWindow.document.write(). Isn’t it standard HTML? Just write more lines in the format <script> <BR><!-- <BR>function openwin() { <BR>window.open ("page.html", "newwindow", "height=100, width=100, top=0, <br><br>left=0,toolbar=no, menubar=no, scrollbars=no, resizable=no, location=n <br><br>o, status=no") <BR>//写成一行 <BR>window.open ("page2.html", "newwindow2", "height=100, width=100, top=1 <br><br>00, left=100,toolbar=no, menubar=no, scrollbars=no, resizable=no, loca <br><br>tion=no, status=no") <BR>//写成一行 <BR>} <BR>//--> <BR></script><script> <BR><!-- <BR>function openwin() { <BR>window.open("page.html","","width=200,height=200") <BR>} <BR>//--> <BR></script>. Be sure to note that an error will occur if there is one more label or one less label. Remember to end with <script> <br><br>function closeit() { <br><br>setTimeout("self.close()",10000) //毫秒 <br><br>} <br><br></script><script> <BR>function openwin() <BR>{ <BR>OpenWindow=window.open("", "newwin", "height=250, width=250,toolbar=no <br><br>,scrollbars="+scroll+",menubar=no"); <BR>//写成一行 <BR>OpenWindow.document.write("<TITLE>例子") <BR>OpenWindow.document.write("<BODY BGCOLOR=#ffffff>") <BR>OpenWindow.document.write("<h1>Hello!") <BR>OpenWindow.document.write("New window opened!") <BR>OpenWindow.document.write("") <BR>OpenWindow.document.write("") <BR>OpenWindow.document.close() <BR>} <BR></script>OpenWindow.document.close().
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn