JavaScript and Neat Tricks Examples

Many tutorials available on the web, find some and go through 'em. A tutorial

Remove underline on Link tags

Remove the underline on link tags
Example for link to this page
This is actually an HTML attribute STYLE=
Add to the a href tag STYLE="TEXT-DECORATION: NONE"

OR, to affect all href tags in your document, use a CSS style sheet inside your HEAD tag
<STYLE> a {text-decoration:none} </STYLE>

Dialog Boxes

How to pop up a dialog box, one when the page first loads, and a second when you click on the button.
Also shows how to use document.write inside the body tag.
alert and using document.write in body tag

to open an alert dialog box:

  alert( "text you want in the alert" );

to open a confirm dialog box with OK and Cancel buttons:

  confirm( "text you want in the dialog box" );

But usually we want to keep track which button they selected
var selection = confirm( "text you want" );
Now we can decide what to do based on their selection

  if (  selection == true )
 	{
		alert( "You selected the OK button! " );
	}
	else
		alert( "You selected the CANCEL button." );

How to open up a new window

open Window

Options:

toolbar = 0 for no, 1 for yes OR put no or yes
status = 0 for no, 1 for yes OR put no or yes
menubar = 0 for no, 1 for yes OR put no or yes
scrollbars = 0 for no, 1 for yes OR put no or yes
resizable = 0 for no, 1 for yes OR put no or yes
width = in pixels or percentage with %
height = in pixels or percentage with %

To create a new window, call

   window.open( "", "title", options );

Helps to store option string in a variable:

	var option = "toolbar=1,status=0,menubar=0,scrollbars=0," +
			"resizable=0,width=300,height=200";

Change on mouse rolling over

How to change something when the mouse rolls over...
Works on:

Over an a href tag
Over an image

mouseover

These are attributes added to either an href tag or img tag.
Example:

<a href="http://www.colostate.edu" 
	onmouseover="document.bgColor='red';"
	onMouseout="document.bgColor='yellow';"
	>  Roll over to change background color </a>

<a href="http://www.colostate.edu" 
	onmouseover="document.bgColor='blue';"
	onMouseout="document.bgColor='green';"
	>  Roll over to change background color </a>

Static Background Image

Make the background image still (doesn't move when user scrolls)
NOTE: Only works on Windows!
fixed image background
Works better using CSS (Cascading Style Sheets)
CSS fixed image background

For more on CSS, find a tutorial like this one: tizag.com

Dates

Check out date

var now = new Date( );

now.toLocaleString( )
now.getMonth( )
now.getDate( )
now.getYear( )
now.getHours( )
now.getMinutes( )

document.lastModified: --> Mon, 25 Sep 2006 16:32:29 GMT
Date.parse( document.lastModified): -->1159201949000

Document attributes

	document.bgColor="#FF00FF";
        document.fgColor="#00FF00";
        document.title="Workings of a master";
	document.lastModified		
	Date.parse(document.lastModified)

document.write vs. document.writeln

Fun Thangs Others Wrote

Add something fun that someone else wrote!
Example: buggy
Taken from: Special Effects at HotScripts.com