Home > Developer > JavaScript
"1, normal pop-up window"
In fact, the code is very simple:
<script language=javascript>
<!--
window.open (' page.html ')
-->
</SCRIPT>
Because this is a javascripts code, they should be placed between the <script language=javascript> label and the </script>. <!--and--> are useful for some versions of browsers that do not display the code in the label as text in these old browsers. To develop this good habit ah.
window.open (' page.html ') is used to control the pop-up of the new window page.html, if page.html is not in the same path as the main window, before the path, absolute path (http://) and relative path (...) should be specified. /) are available.
Both single and double quotes are OK, just don't mix.
This piece of code can be added anywhere in HTML,
"2, after the Set pop-up window"
Let's say a pop-up window setting. Just add something to the code above. Let's customize the appearance of this pop-up window, size, and popup position to fit the page's specifics.
<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 line
-->
</SCRIPT>
Parameter explanation:
<script language=javascript> js script started;
window.open the command to eject a new window;
The filename of the ' page.html ' pop-up window;
' NewWindow ' pop-up window name (not filename), not required, available null ' 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 for display;
Menubar,scrollbars represents the menu bar and scroll bar.
Resizable=no whether to allow changes to the window size, yes to allow;
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 open), yes to allow;
</SCRIPT> JS script End
"3, control pop-up window with function"
The following is a complete code.
<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 line
}
-->
</script>
<body Onload=openwin () >
.. Any page content ...
</body>
A function Openwin () is defined here, and the function content is to open a window. There is no use before calling it.
How to call it?
Method One: <body onload=openwin () > Browser pop-up window when reading the page;
Method Two: <body Onunload=openwin () > Browser out of the page pop-up window;
Method Three: Call with a connection:
<a href= Note: Use the "method four: Call with a button:
<input Type=button Onclick=openwin () value= open Window >
"4, pop-up 2 windows at the same time"
Change the source code a little bit:
<script language=javascript>
<!--
function Openwin () {
window.open (page.html, NewWindow, height=100, width=100, Top=0, Left=0,toolbar=no, Menubar=no, Scrollbars=no, Resizable=no, Location=no, Status=no)
Write a line
window.open (page2.html, NewWindow2, height=100, width=100, top=100, Left=100,toolbar=no, Menubar=no, Scrollbars=no, Resizable=no, Location=no, Status=no)
Write a line
}
-->
</script>
To avoid the 2 windows that pop up, use top and left to control the pop-up positions without overwriting each other. The last four methods mentioned above can be invoked.
Note: The name of the 2 windows (NewWindows and NewWindow2) is not the same, or simply all empty. Ok?
"5, the main window to open the file 1.htm, while pop-up small Windows page.html"
The following code is added to the main window
<script language=javascript>
<!--
function Openwin () {
window.open (page.html,,width=200,height=200)
}
-->
</script>
Join <body> Area:
<a href=1.htm Onclick=openwin () >open</a>.
"6, pop-up window of the timing off control"
Below we have some control of the pop-up window, the effect is better. If we add a small piece of code to the pop-up page (note is added to the page.html HTML, not the main page, otherwise ...), let it automatically shut down in 10 seconds is it cooler?
First, add the following code to the <script language=javascript>
function Closeit () {
SetTimeout (Self.close (), 10000)//MS
}
</script>
Then, then use <body Onload=closeit () > This sentence to replace the page.html in the central some <BODY> this sentence on it. (Don't forget to write this sentence!) The function of this sentence is to call the code that closes the window, and then close the window itself after 10 seconds. )
"7, add a Close button in the pop-up window"
<FORM>
<input type= ' BUTTON ' value= ' close ') {
Openpopup ()
Documents.cookie=popped=yes
}
}
Description: The above is JS code, please add their own starting and Terminator
13. Internal Frame <IFRAME> Use
The use format of the IFRAME tag is:
<iframe src=url width=x height=x scrolling=[option] Frameborder=x
Name=main></iframe>
SRC: The path to the file, either HTML file, or text, ASP, etc.
Width and Height: the width and height of the inner frame area;
Scrolling: When the specified HTML file in SRC does not show up in the specified area, the scrolling option, if set to No, the scroll bar does not appear, for auto: The scroll bar appears automatically; Frameborder: The width of the area border, which is often set to 0 in order for the internal frame to fuse with the adjacent content.
Name: The names of the frames used for identification.
For example: When you want to use the parent frame to control the internal framework, you can use the name of the target= frame to control it.
Example: <iframe name=mm src=http://bbs.055.cn;; width=100% height=100% marginwidth=0 marginheight=. ot; Frameborder=0 scrolling=no></iframe>
14. Automatic Jump
In the source code <meta http-equiv=refreshcontent=3; url=http://bbs.055.cn; Charset=gb2312>
Description: Content=3 indicates 3 seconds to refresh to URL
15. How to change the linked mouse shape
Just add this code to the link.
Or you can write it with CSS.
Style=cursor:hand Style=cursor:crosshair
Style=cursor:text style=cursor:wait
Style=cursor:move Style=cursor:help
Style=cursor:e-resize
Style=cursor:n-resize
Style=cursor:nw-resize style=cursor:w-resize
Style=cursor:s-resize
Style=cursor:se-resize
Style=cursor:sw-resize
The above code you only need to add to the link or page of the style area can be implemented to diversify the mouse.
16. Full Screen Display
<form>
<div align=center>
<input Type=button name=fullscreen value= full Screen onclick=window.open (document.location, ' big ', ' Fullscreen=yes ') >
</div>
</form>
Put it in the <body> area.
17. Set as homepage
<script language=javascript>
<!--
function Defaul_home () {
This.home.style.behavior= ' url (#default #homepage) '; This.home.setHomePage (http://bbs.055.cn/';
}
var Focusok=false;
if (navigator.appname = = netscape{
Focusok=true;
}
Vers=navigator.appversion;
if (navigator.appname = = Microsoft Internet explorer{
Pos=vers.lastindexof ('. ');
Vers=vers.substring (pos-1,vers.length);
}
Proper_version=parsefloat (vers);
if (proper_version>=5) {
Focusok=true;
}
function Launchstock1 (htmlurl) {
var Stock=window.open (Htmlurl,stock,top=2,left=2,toolbar=no,location=no,directories=no,status=no,menubar=no, Scrollbars=yes,
resizable=no,width=700,height=510;
if (Focusok) {
Stock.focus ();
}
return true;
}
function Launchstock () {
var stock=window.open (, Stock,top=2,left=2,toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars =yes,
resizable=no,width=700,height=510;
if (Focusok) {
Stock.focus ();
}
return true;
}
-->
</script>
<a href=# name=home onclick=defaul_home (); Title===e Time ==> Set homepage </a>
18. Here is the code to add favorites
<a href=# onclick=window.external.addfavorite (http://bbs.055.cn ';. ') Dawn Accord ') target=_self title= Dawn Accord > Add Favorites </a>
19.flash Picture Effect
The following code joins the <script language=javascript>
<!--
function Makevisible (Cur,which) {
if (which==0)
cur.filters.alpha.opacity=100
Else
Cur.filters.alpha.opacity=20
}
-->
</SCRIPT>
The following code joins the <body> area
// Please change your picture address
20.load progress bar
<table cellspacing=0 cellpadding=0 bgcolor= #FFFFFF width=40% id=p><tr><td>
<table cellspacing=0 cellpadding=0 bgcolor= #0000FF height=18 id=q><tr><td></td></tr> </table></td></tr></table>
</center>
<script language=javascript>
var R = 0; Load ();
function Load () {R = R + 2; Q.style.width = R +%; Time= settimeout (Load (), 50);
if (R > MB) {cleartimeout (time); P.style.width=0}}
</script>
27 Full Screen
<script language=javascript>
window.open (' index.asp ', ', ', ' fullscreen=1 ');
</script>
21. Background picture Scrolling
<body scroll=no background=images/bg.jpg link= #00FF00 alink= #FF0000 vlink= #00FF00 bgcolor= #000080 topmargin=8>
<script language=javascript>
var backgroundoffset = 0;
var bgobject = eval (' document.body ');
function SCROLLBG (maxSize) {backgroundoffset = Backgroundoffset + 1;
if (Backgroundoffset > maxSize) backgroundoffset = 0;
bgObject.style.backgroundPosition = 0 + backgroundoffset;}
var Scrolltimer = Window.setinterval (SCROLLBG (410), 20)
</script>
22. Web pages are not cached
HTML Web page
<meta Http-equiv=pragma content=no-cache>
<meta Http-equiv=cache-control Content=no-cache, must-revalidate>
<meta http-equiv=expires content=wed Feb 1997 08:21:57 gmt>
or <meta http-equiv=expires content=0>.
ASP Web page
Response.Expires =-1
Response.ExpiresAbsolute = Now ()-1
Response.CacheControl = No-cache
PHP Web page
Header (Expires:mon, June June 1997 05:00:00 GMT;
Header (Cache-control:no-cache, must-revalidate;
Header (Pragma:no-cache;
23.
<%
' defines some constants for database connections
Const ADOPENFORWARDONLY = 0 ' cursors only navigate forward records, do not support paging, Recordset, BookMark
Const adOpenKeyset = 1 ' keyset cursor, changes made to records by other users will be reflected in the recordset, but other users adding or deleting records will not be reflected in the recordset. Support for paging, Recordset, BookMark
Const adopendynamic = 2 ' Dynamic cursors are the most powerful, but also the most expensive sources. User changes to the record, add or delete records will be reflected in the recordset. Supports full feature browsing (not supported by Access).
Const adopenstatic = 3 ' static cursors, just a snapshot of the data, changes that the user makes to the record, adding or deleting records are not reflected in the recordset. Supports moving forward or backward
Const ADLOCKREADONLY = 1 ' lock type, default, read-only, cannot make any changes
Const adLockPessimistic = 2 ' When editing immediately locks the record, the safest way
Const adLockOptimistic = 3 ' The recordset is locked only when the Update method is called, while other previous operations can still make changes to the current record, insert and delete
Const adlockbatchoptimistic = 4 ' Records are not locked while editing, and change, insert, and delete are completed in batch mode
Const ADCMDTEXT = &h0001
Const adCmdTable = &h0002
%>
24. Minimize, maximize, close windows
<object ID=HH1 classid=clsiddb880a6-d8ff-11cf-9377-00aa003b7a11>
<param Name=command value=minimize></object>
<object ID=HH2 classid=clsiddb880a6-d8ff-11cf-9377-00aa003b7a11>
<param Name=command value=maximize></object>
<object Id=hh3 classid=clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11>
<param Name=command value=close></object>
<input Type=button value= Minimize onclick=hh1. Click () >
<input Type=button value= maximize ONCLICK=HH2. Click () >
<input Type=button value= closes Onclick=hh3. Click () >
Note: This example applies to IE
25. Determining the origin of the previous page
ASP page:
Request.ServerVariables (Http_referer
java Script:
Document.referrer
26. Cursor is stopped at the end of text box text
<script language=javascript>
function cc ()
{
var e = event.srcelement;
var r =e.createtextrange ();
R.movestart (' character ', e.value.length);
R.collapse (TRUE);
R.select ();
}
</script>
<input type=text name=text1 value=123 onfocus=cc () >
Description: Apply to tabular data submission
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
