Click on a hyperlink, pop up a fixed-size new window (JS implementation), the need for friends can refer to the next.
1, the most basic pop-up window code
<script language= "JavaScript" > <!--window.open (' page.html ')--</SCRIPT>
Because this is a javascripts code, they should be placed in <scriptlanguage= "JavaScript" > between the labels and the </script>. <!--and is useful for browsers with low versions, where the code in the tags is not displayed as text in these old browsers. It's a good habit to develop. window.open (' page.html ') is used to control the popup new window page.html, if page.html is not in the same path as the main window, the path, absolute path (http://) and relative path (. /) are available. You can use both single and double quotes, just don't mix. This piece of code can be added anywhere in the HTML,<head> and
2. After setting the popup window
Let's talk about the settings for the popup window. Just add a little something to the code above. Let's customize the appearance of this pop-up window, size, pop-up position to fit the specific situation of the page.
<script language= "JavaScript" > <!-- //This sentence to write a line window.open (' page.html ', ' newwindow ', ' height=100, width=400, Top=0, left=0, Toolbar=no, Menubar=no, Scrollbars=no, resizable=no,location=n o, Status=no ')--</SCRI Pt>
Parameter explanation:
<scriptlanguage= "JavaScript" >js script starts;
window.open the command that pops up the new window;
The filename of the ' page.html ' pop-up window;
The name of the ' NewWindow ' pop-up window (not the file name), not required, available empty ' ' instead;
height=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;
Toolbar=no whether the toolbar is displayed, yes is displayed;
Menubar,scrollbars represents the menu bar and scroll bar.
Resizable=no whether the window size is allowed to change, yes is allowed;
Location=no whether the address bar is displayed, yes is allowed;
Status=no whether the information in the status bar is displayed (usually the file is already open), yes is allowed;
</script>js Script End
3. Use function to control pop-up window
The following is a complete code:
status=no ")//write a line}//--> </script>
A function Openwin () is defined here, and the function content is to open a window. There is no use before calling it. How to invoke it?
Method One: <bodyonload= "Openwin ()" > Browser read page popup window;
Method Two: <bodyonunload= "Openwin ()" > Pop-up window when the browser leaves the page;
Method Three: Call with a connection:
<ahref= "#" onclick= "Openwin ()" > Open a Window </a>
Note: The "#" used is a virtual connection.
Method Four: Call with a button:
<inputtype= "button" onclick= "Openwin ()" value= "open Window" >
4. Pop up 2 windows at the same time
Change the source code slightly:
Status=no ");//write a line window.open (" page2.html "," NewWindow2 "," height=100, width=100, Top=1 xx, Left=100,toolbar=no, Menubar=no, Scrollbars=no, Resizable=no, Loca Tion=no, Status=no ")}//--> </script>
To avoid the pop-up of the 2 window overlay, use top and left to control the pop-up position do not cover each other. Finally, the four methods mentioned above can be called.
Note: The name of the 2 windows (NewWindows and NewWindow2) is not the same, or altogether empty.
5, the main window open file 1.htm, while the small window pop-up page.html
Add the following code to the main window
<script language= "Openwin () {window.open (" page.html "," "," width=200,height=200 ")}//--> </script& gt;
Join <body> Area:
<ahref= "1.htm" onclick= "Openwin ()" >open</a>.
6. Timed off control of popup window
Let's take some control of the popup window, and the effect will be better. If we add a little piece of code to the pop-up page (note that the HTML that joins page.html is not on the main page, otherwise ...), will it be cooler to turn it off automatically after 10 seconds?
First, add the following code to the < head> area of the page.html file:
<script language= "JavaScript" > Function Closeit () {setTimeout ("self.close ()", 10000)//msec} </script>
Then, and then use <bodyonload= "Closeit ()" > This sentence instead of page.html the central Plains have a <BODY> this sentence can be. (This sentence must not forget to write Ah!) The function of this sentence is to invoke the code that closes the window, and then close the window on its own after 10 seconds. )
7. Add a Close button to the pop-up window
<FORM>
<inputtype= ' BUTTON ' value= ' off ' onclick= ' window.close () ' >
</FORM>
Oh, now more perfect!
8, within the pop-up window-a page two windows
The example above contains two windows, one is the main window and the other is a small pop-up window. In the following example, you can perform the above effect on a page.
head> <script language= "JavaScript" > Function Openwin () {Openwindow =window.open ("", "Newwin", "height=250, Width=250,toolbar=no, scrollbars=" +scroll+ ", Menubar=no"); Write a line OpenWindow.document.write ("<TITLE> example </TITLE>") OpenWindow.document.write ("<body bgcolor=# Ffffff> ") OpenWindow.document.write ("
opened! ") OpenWindow.document.write ("</BODY>") OpenWindow.document.write ("</HTML>") OpenWindow.document.close ( )} </SCRIPT> </
head> <body> <a href= "#" onclick= "Openwin ()" > Open a Window </a> ; <input type= "button" onclick= "Openwin ()" value= "open Window" > </body>
See OpenWindow.document.write () The code inside is not the standard HTML? Just write more lines in the format. Pay attention to one more tag or one less tag and there will be an error. Remember to end with OpenWindow.document.close ().
9, the Ultimate app-popup window of the cookie control
Recall, the above pop-up window is cool, but there is a little trouble (immersed in joy, must not find it?) For example, if you put the above script in a page that needs to be frequently passed (such as the homepage), then each time you refresh the page, the window will pop up once, is it annoying? :-(
Is there a workaround? yes!;-) FollowMe. We can use cookies to control it.
First, add the following code to the <HEAD> area of the main page HTML:
<script> function openwin () {window.open ("page.html", "", "width=200,height=200")} func tion Get_cookie (name) {var search = Name + "=" var returnvalue = ""; if (Document.cookie.length > 0) {offset = document.cookie.indexOf (search) if (offset! = 1) { Offset + = Search.length end = Document.cookie.indexOf (";", offset); if (end = =-1) end = Document.cookie.length; Returnvalue=unescape (document.cookie.substring (offset, end))}} return returnvalue; } function Loadpopup () {if (Get_cookie (' popped ') = = ") {openwin () document. Cookie= "Popped=yes"}} </script>
Then, with <bodyonload= "Loadpopup ()" > (note not openwin but Loadpop!) Replace the main Page <BODY> this sentence can be. You can try refreshing this page or re-entering the page, and the window will never pop up again. The real pop-only-once!.
Source: http://bbs.csdn.net/topics/280032871 7 floor
Click on a hyperlink to pop up a fixed-size new window (JS implementation)
