Tuesday, 3 January 2012

frame

<html>
<head>
<title>Navigation Frame</title>
</head>
<body>
<p>
Follow one of there links
to load a page into the right -hand
frame:
</p>
<ul>
<li><a href="#" onMouseover="parent.right.location='order.html';">
order form</a>

<li><a href="#" onMouseover="parent.right.location='email.html';">
email form</a>

<li><a href="#" onMouseover="parent.right.location='sale.html';">
sales Dept</a>

<li><a href="#" onMouseover="parent.right.location='link.html';">
other links</a>

</ul>

</body>
</html>

-----------------------------------------------------------------------------------------------------

<html>
<head>
<title>Frame Navigation Example</title>
</head>

<frameset cols="*,*">
<frame name = "left" src="left.html">
<frame name = "right" src="about:blank">
</frameset>


<body>

</body>
</html>
   

Timeout

<html>
<head><title>Timeout Example</title>
<script>
var counter = 0;
ID=window.setTimeout("Update();",1000);

function Update(){
    counter++; // counter add itselves
    window.status="The counter is not at " + counter; // status bar show the message
    document.form1.input1.value="The counter is not at " + counter; //to show exact number on the text box
    ID=window.setTimeout("Update();", 1000); //
    }
</script>
</head>
<body>
<h1> Timeout Example</h1>
<hr />
<p>
the text value below and the status line are being updated every two seconds. Press the Reset button
to restart the count, or the stop button to stop it.
</p>

<hr />

<form name= "form1">
<input type = "text" name = "input1" size="40"> <br />
<input type = "button" value="reset" onClick="counter = 0;"> <br />
<input type = "button" value="stop" onClick =" window.clearTimeout(ID);">
<hr />
</body>
</html>

Monday, 2 January 2012

creating a new window

creating a new window

smallwin = window.open("","small", "width=100, height=120, toolbar=0, status=0");
                                       url, windows name, feature list

Time Out

ident=window.setTimeout("alert('Time is up!')", 10000);

onmousedown event

<html>
<head>

<title> creating an event handeler </title>

<script type="text/javascript">

    function mousealert() {
    alert ("You clicked the mouse");
    }
    document.onmousedown = mousealert;
   

</script>

</head>

<body>

</body>

</html>

onMouseOver event

<html>
<head>

<title> creating an event handeler </title>



</head>

<body>

    <a href="http://www.westerntowncollege.com" onMouseOver="window.alert('you moved over the link.');">
    Click here</a>
   


</body>

</html>

chapter 11 creating custiom object

<html>
<head>

<title> Javascript business card </title>

<script type ="text/javascript">

    function PrintCard (){
    line1 = "<b>Name: </b>" + this.name + "<br />\n";
    line2 = "<b>Address: </b>" + this.Address + "<br />\n";
    line3 = "<b>Work Phone: </b>" + this.workphone + "<br />\n";
    line4 = "<b>Home Phone: </b>" + this.homephone + "<hr />\n";
    document.write(line1, line2, line3, line4);
    }
   
    function Card (name, address, work, home){
    this.name = name;
    this.address = address;
    this.work_phone = work;
    this.home_phone = home;
    this.PrintCard = PrintCard;
    }
</script>

</head>

<body>

<h1>Javascript Business Card Test </h1>
Script begins here.
<hr />

<script type ="text/javascript">

    sue = new Card("Sue suthers", "123 Elm street", "555-1234", "555-9876");
    phred = new Card("Phred Madsen", "233 Oak Lane", "555-2222", "555-4444");
    henry = new Card("Henry Tillman", "233 Walnut Circle", "555-1299", "555-1344");
   
    sue.PrintCard();
    phred.PrintCard();
    henry.PrintCard();
   
</script>
    End of script.

</body>

</html>


-----------------------------------------------------------------------------------
output

Javascript Business Card Test

Script begins here.
Name: Sue suthers
Address: undefined
Work Phone: undefined
Home Phone: undefined
Name: Phred Madsen
Address: undefined
Work Phone: undefined
Home Phone: undefined
Name: Henry Tillman
Address: undefined
Work Phone: undefined
Home Phone: undefined
End of script.