- Goals
- The primary purpose of this assignment is to make sure everyone has the capability to put up a web page.
- The secondary purpose is to introduce XHTML, Javascript, and validation tools in a hands on way, in preparation for the next assignments.
- Instructions
- Work with Nick if necessary to find a place to host a web page. Your own server is fine as long as it is up 24-hours a day.
- Create a web page which is valid "XHMTL - Transitional". Use the W3C tools to verify that you have no errors. Look at the source of this web page in order to get the correct "DOCTYPE".
- Your web page should contain the following:
- a title tag
- an img tag
- a list (ordered or unordered)
- a table
- it should also contain the following snippet of HTML in the body of the XHTML document, except that it should be modified to show a sequence of four different pictures rather than 3 pictures of espresso cups:
- Code:
<script language="JavaScript" type="text/javascript">
<!--
var images = new Array();
var imageNum = 0;
var imageSpeed =1000;function loadAll() {
images[0] = new Image();
images[0].src = "http://static.flickr.com/42/123309308_d3b21e1aef_s.jpg";
images[1] = new Image();
images[1].src = "http://static.flickr.com/42/123310130_5f21c2d1e7_s.jpg";
images[2] = new Image();
images[2].src = "http://static.flickr.com/36/123310638_2b9e1e8fb7_s.jpg";
}
function rotateImage() {
if(play){
if (imageNum < (images.length - 1)) {
imageNum++;
}
else {
imageNum = 0;
}
document.placeHolder.src = images[imageNum].src;
setTimeout("rotateImage()",imageSpeed);
}
}function doButton(){
var e = document.getElementById("startButton");
var currentLabel = e.value;
if (currentLabel == "Start") {
loadAll();
e.value = "Pause";
play = true;
setTimeout("rotateImage()",imageSpeed);
}
else if (currentLabel == "Pause") {
e.value = "Play";
play = false;
} else {
e.value = "Pause";
play = true;
setTimeout("rotateImage()",imageSpeed);
}}
-->
</script> -
<img src="http://static.flickr.com/36/123310638_2b9e1e8fb7_s.jpg" name="placeHolder" alt="rotating Image"/><br/>
<input id="startButton" type="button" value="Start" onclick="doButton()"/>
- Code:
- The original code has the following functionality
-
Photos are courtesy of Chupy
-
- Your web page should not violate any copyrights, which basically means you must own all the content that is displayed on the page, or have permission from the owner. (Especially images.)
- Finally, when you are done you must complete a "quiz" informing us that you are done. The quiz is located in the EEE tools. Possibly here. The quiz closes at noon on Monday April 17th, so don't delay. We are going to look at the web site that you create, so make sure it stays up for at least three weeks.
- Grading Criteria
- 25%: Does the web page validate?
- 10%: Title tag
- 5%: Img tag
- 5%: List tag
- 5%: Table tag
- 10%: Javascript inclusion
- 10%: Photos were changed
- 25%: Turned-in on time
- 5%: no copyright violations