Lecture JavaScript Examples. Contents Verify fields of a form, verify.htm Show rollovers,...

Lecture

JavaScript Examples

Contents

• Verify fields of a form, verify.htm• Show rollovers, rollovers2.htm

Verify Fields of This Form

Verify a Form

<HTML><HEAD><TITLE>Verify Fields</TITLE>

<SCRIPT LANGUAGE="javascript">

var name=prompt("Please type your first name and click OK","")

function submitted() {

alert("Information submitted!") }

function clearUp() {

if ( document.info.elements[0].value=="" ||

document.info.elements[1].value=="" ||



document.info.elements[4].value=="" ) {

alert("Please complete each field") }

else { submitted() } }

</SCRIPT></HEAD><BODY >

Verify a Form

<h2>Please fill in this form</H2>

<SCRIPT language=javascript>

document.write("<h2>Welcome to this page, " + name + "!</h2>") </SCRIPT>

<FORM NAME="info">

Last Name: <INPUT TYPE="TEXT" SIZE=20 ID="lastname"><BR>

Street Address:<INPUT TYPE="TEXT" SIZE=30 ID="address"><BR>

City: <INPUT TYPE="TEXT" SIZE=20 ID="city"><br>

State:<INPUT TYPE="TEXT" SIZE=6 ID="state"><br>

Zip Code:<INPUT TYPE="TEXT" SIZE=15 ID="zipcode">

<BR>Click here to submit this information. <INPUT TYPE="BUTTON" VALUE="Send now!” onClick="clearUp()">

<BR>Reset form fields <INPUT TYPE="reset" VALUE="Clear form"></FORM> <H2>Contact Us Directly!</H2>

Find out more about what we have to offer. Contact the office at <A HREF="MAILTO:[email protected]" onMouseOver="window.status='We will reply to your inquiry within 24 hours!';return true" onMouseOut="window.status='';return true">[email protected]</A> </BODY></HTML>

Rollovers

Images changecolor as mousecursor is movedacross

Rollovers<SCRIPT LANGUAGE="JavaScript">

<!-- if (document.images) {

img1on = new Image();

img1on.src = "image1on.jpg";







img1off = new Image();

img1off.src = "image1off.jpg";






img4off.src = "image4off.jpg";}

Rollovers

function imgOn(imgName) {

if (document.images) {

document[imgName].src = eval(imgName + "on.src");

}

}

function imgOff(imgName) {

if (document.images) {

document[imgName].src = eval(imgName + "off.src"); }}

//-->

</SCRIPT></HEAD><BODY>

Rollovers<h2>Our Car Comparison page</h2><BR>

<A HREF = "const.htm" onMouseOver = "imgOn('img1')" onMouseOut = "imgOff('img1')" STYLE="color:green">

<IMG NAME= "img1" BORDER = 0 HEIGHT = 65 WIDTH = 65 SRC = "image1off.jpg">Mercedes</A><BR>

<A HREF = "const.htm" onMouseOver = "imgOn('img2')" onMouseOut = "imgOff('img2')" >

<IMG NAME= "img2" BORDER = 0 HEIGHT = 65 WIDTH = 65 SRC = "image2off.jpg">Lexus</A><BR>

<A HREF = "const.htm" onMouseOver = "imgOn('img3')" onMouseOut = "imgOff('img3')" STYLE="color:#A52A2A">

<IMG NAME= "img3" BORDER = 0 HEIGHT = 65 WIDTH = 65 SRC = "image3off.jpg">Jaguars</A><BR>

<A HREF = "const.htm" onMouseOver = "imgOn('img4')"onMouseOut = "imgOff('img4')" STYLE="color:black">

<IMG NAME= "img4" BORDER = 0 HEIGHT = 65 WIDTH = 65 SRC = "image4off.jpg">Acura</A><BR></BODY></HTML>

Lecture JavaScript Examples. Contents Verify fields of a form, verify.htm Show rollovers,...

Documents

Transcript of Lecture JavaScript Examples. Contents Verify fields of a form, verify.htm Show rollovers,...