Hello everyone, I am excited to have researched and join a community of talented web designers. Currently, I am a student at a local college, studying for a AS in Internet Services Technology. The web design course I am taking is an online only course, where the professor is an off campus professor who teaches a University in the same city. Therefore, any trouble I run into, I have to post to the schools online campus web page or send in a email through the web page. Which requires waiting for a response. So I decided to join a community. I believe here, I can learn a lot, and seek advice when running into a road block. Another way of getting advice which increases my chance of an immediate response. Also, with my Art background (A.A. in Art Studio) perhaps I can give some ideas when needed.
On my current assignment, we are coding a web page that uses a slide show using javascript. I have coded my page exactly like the course designer illustrated via pdf file. But the page is still not working. I was wondering if someone could take a look at the code and maybe tell me what’s wrong.
I greatly appreciate all who have taken the time to read, and who are able to view and critique the code I did for the current assignment.
Thanks!
<?xml version= "1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type= "text/javascript" language= "JavaScript">
var animalsSlides = new Array();
animalSlides[0] = new Image();
animalSlides[1] = new Image();
animalSlides[2] = new Image();
animalSlides[3] = new Image();
animalSlides[4] = new Image();
animalSlides[5] = new Image();
animalSlides[0].src= "images/bison_walk.jpg";
animalSlides[1].src= "images/bison_sits.jpg";
animalSlides[2].src= "images/deer_baby.jpg";
animalSlides[3].src= "images/deer1.jpg";
animalSlides[4].src= "images/deer_face.jpg";
animalSlides[5].src= "images/birds1.jpg";
var theCaptions = new Array();
theCaption[0] = "Out for a stroll";
theCaption[1] = "Keeping warm by a geyser";
theCaption[2] = "A baby deer";
theCaption[3] = "Mom is looking for her baby";
theCaption[4] = "But big sister is looking at you";
theCaption[5] = "Beautiful bathing birds";
var slidenum = 0;
var totalslides = animalSlides.length-1;
function showSlide(direction)
{
if (direction == "next")
{
(slidenum == totalslides) ? slidenum =0 : slidenum ++;
}
else
{
(slidenum == 0) ? slidenum = totalslides : slidenum --;
}
if (document.images)
{
document.slideframe.src = animalSlides[slidenum].src;
document.slidecontrols.caption.value =
theCaptions[slidenum];
document.slidecontrols.theslide.value = slidenum+1;
}
}
</script>
<title>My Slide Show</title>
</head>
<body>
<!-- open the form here and name it "slidecontrols" -->
<form name="slidecontrols">
<table width="750" align="center" border="0">
<tr><td>
<h3>The Wild Animal Slide Show</h3>
</td></tr>
<tr><td>
<img src="images/bison_walk.jpg" name= "slideframe" width= "240"
height= "160" alt= "slide show" />
<p><textarea name= "caption" rows= "2" cols= "50"> Our slide
show begins with a bison out for a stroll in Montana.
</textarea><br>
<input type= "button" value= "Previous slide" onclick= "showSlide ('previous');">
<input type= "button" value= "Nest slide" onclick= "showSlide
('next');">
Slide Number:
<input type= "text" value= "1" name= "theslide" size= "5"></p>
</td></tr>
</table>
</form>
</body>
</html>