The most common js special effect set for webpages

Source: Internet
Author: User

Typical special effects
1. Add to favorites
Note: Click here to add your website to the favorites menu of your browser.
Code:
<Span style = "CURSOR: hand" onClick = "window. external. addFavorite (www.111cn.cn ', 'China WEB First stop") "title =" add to favorites Yancheng users
Cai Wang "> Add this site to favorites </span>

2. Set as Homepage
Note: Click it to set your website to the browser's start page.
Code:
<Span onclick = "var
StrHref = window. location. href; this. style. behavior = 'url (# default # homepage) '; this. setHomePage ('HTTP: // www.ycrc.com.cn ');"
Style = "CURSOR: hand"> set as homepage </span>

3. Remove the underline Of the hyperlink.
Note: sometimes it is annoying to look at the underline Of the hyperlink. Place the following code between the source code Note: The <body> label of a webpage cannot contain links or other attributes. Otherwise, the effect will be invalid!
Code:
<Style TYPE = "text/css">
<! --
A: link {text-decoration: none}
A: visited {text-decoration: none}
A: hover {color: # ff00ff; text-decoration: underline}
-->
</Style>

4. Automatically refresh the webpage
Note: adding the following code in HTML will automatically become a target.html page right after five minutes. In the code, 300 is the refresh Delay Time
In seconds. Targer.html: The target page you want to switch to. If this page is set, the page is automatically refreshed.
Code:
<Meta http-equiv = "refresh" content = "300; url?target.html">

5. Refresh this page
Note: Click to refresh the page.
Code:
<A href = "javascript: location. reload ()" target = "_ self"> refresh </a>

6. Return to the previous page
Note: Click it to return to the previous page.
Code:
<A href = "javascript: history. back (-1)"> return to the previous page </a>

7. jump out of a small window
Note: When you open a page with the following code, a small window of 468x60 is displayed. “Window.html "is the page to be displayed in the pop-up window. Toolbar, sta
Tus, menubar, scrollbars, set the toolbar, status bar, menu bar, and scroll bar of a small window, And resizable to change the size and width of a small window.
And height to set the width and height of a small window. (However, such a small window is generally not welcome !)
Code:
<Script language = "JavaScript">
Window. open ("too many html", "www_ycrc_com_cn", "toolbar = no, status = no, menubar = no,
Scrollbars = no, resizable = no, width = 468, height = 60, left = 200, top = 50 ");
</Script>

8. automatically close the window
Note: If the following code is added to the source code of the webpage, the window will be automatically closed 20 seconds later! This works well with a small pop-up window! "I = 20" in the code
The delay time for disabling is 20 seconds, which can be modified at will.
Code:
<Script language = "javascript">
<! --
Function clock () {I = I-1
Document. title = "this window will be closed automatically after" + I + "seconds! ";
If (I> 0) setTimeout ("clock ();", 1000 );
Else self. close ();}
Var I = 20
Clock ();
// -->
</Script>

9. add page Protection
Note: If you do not want to easily Copy and Paste your work, add the following code to HTML. When you right-click a webpage
The current menu is not the desired shortcut, but a warning window. "\ N" indicates a line break.
Code:
<Script language = "JavaScript">
Function ycrc_com_cn ()
{
If (event. button = 2) alert ('for browsing only! Thank you! \ N please contact me if you have any questions! ')
}
</Script>

Change <body>
<Body onmousedown = "ycrc_com_cn ()">

10. fixed font size
Note: Have you ever had such an experience: When you browse a webpage with a good layout, you can set the browser font size to a large size or an hour, and the beautiful web page will be instantly invisible. Because the word size is large
The layout is naturally messy. Now, you just need to add the following code to the Code:
<Style type = "text/css">
<! --
Body {font-size: 9pt}
Td {font-size: 9pt}
-->
</Style>

11. Dynamic welcome speech in the status bar
Note: A Welcome Message is displayed in the browser's status bar that starts from one word to the left!
Code:
<Script language = "JavaScript">
<! --
Function statusMessageObject (p, d ){
This. msg = MESSAGE
This. out = ""
This. pos = POSITION
This. delay = DELAY
This. I = 0
This. reset = clearMessage
}
Function clearMessage (){
This. pos = POSITION
}
Var POSITION = 100
Var DELAY = 5
Var MESSAGE = "Welcome! Welcome to WWW. YCRC. COM. CN"
Var scroll = new statusMessageObject ()
Function scroller (){
For (scroll. I = 0; scroll. I <scroll. pos; scroll. I ++ ){
Scroll. out + = ""
}
If (scroll. pos> = 0)
Scroll. out + = scroll. msg
Else scroll. out = scroll. msg. substring (-scroll. pos, scroll. msg. length)
Window. status = scroll. out
Scroll. out = ""
Scroll. pos --
If (scroll. pos <-(scroll. msg. length )){
Scroll. reset ()
}
SetTimeout ('scroller () ', scroll. delay)
}
Function snapIn (jumpSpaces, position ){
Var msg = scroll. msg
Var out = ""
For (var I = 0; I <position; I ++)
{Out + = msg. charAt (I )}
For (I = 1; I <jumpSpaces; I ++)
{Out + = ""}
Out + = msg. charAt (position)
Window. status = out
If (jumpSpaces <= 1 ){
Position ++
If (msg. charAt (position) = '')
{Position ++}
JumpSpaces = 100-position
} Else if (jumpSpaces> 3)
{JumpSpaces * =. 75}
Else
{JumpSpaces --}
If (position! = Msg. length ){
Var cmd = "snapIn (" + jumpSpaces + "," + position + ")";
ScrollID = window. setTimeout (cmd, scroll. delay );
} Else {
Window. status = ""
JumpSpaces = 0
Position = 0
Cmd = "snapIn (" + jumpSpaces + "," + position + ")";
ScrollID = window. setTimeout (cmd, scroll. delay );
Return false
}
Return true
}
SnapIn (100,0 );
// -->
</Script>

12. Protect your pages from being put in the framework by others
Note: Some people are really too lazy to put the webpage prepared by others into the Frame of their own webpage, and others' achievements will become their own, and cannot see the real address of the webpage
! To prevent your results from being plagiarized by these people, you can add the following code to the HTML Of Your webpage, so that your webpage will always open in the whole window.
Code:
<Script LANGUAGE = "JavaScript">
If (self! = Top) {top. location = self. location ;}
</Script>

Button Effects

13. Full Screen Display
Note: The real full screen display can only be disabled with ALT + F4
Code:
<Input type = "BUTTON" name = "FullScreen" value = "full screen" onClick = "window. open (document. location, 'www _ ycrc_com_cn ',
'Fullscreen') ">

14. Open a full screen window
Note: Use a button to open a full screen window.
Code:
<Input type = "button" onClick = "www_ycrc_com_cn ()" value = "try" name = "button">

<Script>
<! --
Function www_ycrc_com_cn (){
Vartargeturl = "http://www.ycrc.com.cn"
Newwin = window. open ("", "", "scrollbars ")
If (document. all ){
Newwin. moveTo (0, 0)
Newwin. resizeTo (screen. width, screen. height)
}
Newwin. location = targeturl
}
// -->
</Script>

15. A large set of buttons for various purposes
Note: a large set of buttons for various purposes
Code:
<Input TYPE = "button" NAME = "view" VALUE = "view source code" OnClick = "window. location = 'view-source: '+ window. location. href">

<Input TYPE = "button" VALUE = "back to the previous step" ONCLICK = "history. back (-1)">

<Input TYPE = "button" VALUE = "Refresh button 1" ONCLICK = "ReloadButton ()">
<Script language = "JavaScript">
<! --
Function ReloadButton () {location. href = "3.html ";}
// -->
</Script>

<P>
<Input TYPE = "button" VALUE = "Refresh button 2" onClick = "history. go (0)">

<Input TYPE = "button" VALUE = "home page button" ONCLICK = "HomeButton ()">
<Script language = "JavaScript">
<! --
Function HomeButton () {location. href = "http://www.ycrc.com.cn ";}
// -->
</Script>

<Input TYPE = "button" VALUE = "pop-up warning box" ONCLICK = "AlertButton ()">
<Script language = "JavaScript">
<! --
Function AlertButton () {window. alert ("have you drunk today? ");}
// -->
</Script>

<P>
<Input TYPE = "button" VALUE = "status bar information" ONCLICK = "StatusButton ()">
<Script language = "JavaScript">
<! --
Function StatusButton () {window. status = "how are you? ";}
// -->
</Script>

<Input TYPE = "button" VALUE = "background color conversion" onClick = "BgButton ()">
<Script language = "JavaScript">
<! --
Function BgButton (){
If (document. bgColor = '# 3399ff ')
{Document. bgColor = '# 00ccff ';}
Else {document. bgColor = '# 3399ff ';}
}
// -->
</Script>

<Input TYPE = "button" VALUE = "open a new window" ONCLICK = "NewWindow ()">
<Script language = "JavaScript">
<! --
Function
NewWindow () {window. open ("http://www.ycrc.com.cn", "", "height = 600, width = 800, left = 10, top = 10, status = no, location = no, toolbar = no,
Directories = no, menubar = no ");}
// -->
</Script>

16. buttons with special effects
Note: buttons with special effects
Code:
<Style type = "text/css">
<! --
. Over {color: yellow; background: navy}
. Down {color: yellow; background: navy; font-style: italic}
-->
</Style>
<Input
Type = "Button" value = "the Button is also crazy" name = "Button"
OnMouseOver = "this. className = 'over ';"
OnMouseOut = "this. className =''; this. value = 'the button is crazy '"
OnMouseDown = "this. className = 'drop ';"
OnMouseUp = "this. className = 'over ';"
OnClick = "this. value = 'I really like you! '">

17. Shake the screen for a while
Note: Let the screen shake for a while
Code:
<Input onclick = "www_ycrc_com_cn (2)" type = "button" value = "Earthquake !!! ">
<Script language = "JavaScript">
<! --
Function surfto (form ){
Var myindex = form. select1.selectedIndex
If (form. select1.options [myindex]. value! = Null ){
Parent. main. location. href = form. select1.options [myindex]. value;
}
}
// -->
</Script>
<Script language = "JavaScript1.2">
<! --
Function www_ycrc_com_cn (n ){
If (window. top. moveBy ){
For (I = 10; I> 0; I --){
For (j = n; j> 0; j --){
Window. top. moveBy (0, I );
Window. top. moveBy (I, 0 );
Window. top. moveBy (0,-I );
Window. top. moveBy (-I, 0 );
}
}
}
Alert ("not scared !!! ");
}
// -->
</Script>

Related Article

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.