I am working on a page that needs to cycle through images with a corresponding description of the image. I can get the images to cycle through but my text isn't doing anything. My function may be way off, I have never tried to simultaneously cycle images and texts. Any help would be greatly appreciated! Here is my code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 STRICT//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<link type="text/css" rel="stylesheet" href="project.css" />
<script type="text/javascript">
/* <![CDATA[ */
function changeDisplay(curLine) {
curLine.style.color = "red";
curLine.style.fontWeight = "bold";
}
function restoreDisplay(curLine) {
curLine.style.color = "blue";
curLine.style.fontWeight = "normal";
}
var curImage = new Array();
curImage[0] = "tool1";
curImage[1] = "tool2";
curImage[2] = "tool3";
curImage[3] = "tool4";
curImage[4] = "tool5";
var curInfo = new Array();
curInfo[0] = "info1";
curInfo[1] = "info2";
curInfo[2] = "info3";
curInfo[3] = "info4";
curInfo[4] = "info5";
function toolPics() {
if (curImage == "tool1") {
document.images[0].src = "images/ladder.jpg";
curImage = "tool2";
if (curInfo == "info1") {
document.getElementsByTagName("p")[2].style.display = "none";
curInfo = "info2";
}
}
else if (curImage == "tool2") {
document.images[0].src = "images/impacter.jpg";
curImage = "tool3";
if (curInfo == "info2") {
document.getElementsByTagName("p")[3].style.display = "none";
curInfo = "info3";
}
}
else if (curImage == "tool3") {
document.images[0].src = "images/saw.jpg";
curImage = "tool4";
if (curInfo == "info3") {
document.getElementsByTagName("p")[4].style.display = "none";
curInfo = "info4";
}
}
else if (curImage == "tool4") {
document.images[0].src = "images/mower.jpg";
curImage = "tool5";
if (curInfo == "info4") {
document.getElementsByTagName("p")[5].style.display = "none";
curInfo = "info5";
}
}
else {
document.images[0].src = "images/toolkit1.jpg";
curImage = "tool1";
document.getElementsByTagName("p")[1].style.display = "block";
curInfo = "info1";
}
}
/* ]]> */
</script>
</head>
<body onload="var begin=setInterval('toolPics()', 5000);">
<div>
<table style="border:none" class="menu">
<tr>
<td><a href="Index.html" class="menuicon" onmouseover="changeDisplay(this)" onmouseout="restoreDisplay(this)">Home</a></td>
<td class="menupipe">|</td>
<td><a href="Specials.html" class="menuicon" onmouseover="changeDisplay(this)" onmouseout="restoreDisplay(this)">Specials</a></td>
<td class="menupipe">|</td>
<td><a href="Tools.html" class="menuicon" onmouseover="changeDisplay(this)" onmouseout="restoreDisplay(this)">Tools</a></td>
<td class="menupipe">|</td>
<td><a href="Prices.html" class="menuicon" onmouseover="changeDisplay(this)" onmouseout="restoreDisplay(this)">Prices</a></td>
<td class="menupipe">|</td>
<td><a href="Order.html" class="menuicon" onmouseover="changeDisplay(this)" onmouseout="restoreDisplay(this)">Shop</a></td>
</tr>
</table>
</div>
<div>
<p>At <em style="color:red">Collin's Tool Supply</em>, we believe that every home should be in possesion of a few necessary tools. These tools will help the average person tackle most projects around the house that do not call for a professional. Take a look and make sure your home is prepared for the quick fix.
</div>
<div>
<table>
<tr>
<td><img src="images/toolkit1.jpg" alt="Tool Kit" /></td>
<td><p id="description1" style="display: block"><strong>Description:</strong> The Craftsmen Tool Kit offers 119 different tools to tackle most of your smaller repairs around the house. A must have in every home!<br />
<strong>Items Included:</strong> 3/8 in. Ratchet Handle, 3/8 in. x 6 in. Extension Bar, 3/8 in. to 1/4 in. Adapter, 3/8 in Socket Set, 1/4 in. x 3 in. Extension Bar, 1/4 in. Socket Set, Combination Wrenches Set, 3/8 in Spark Plug Socket, Screwdrivers, 6 in. Long Nose Pliers, 6 in. Diagonal Pliers, 6 in Adjustable Wrench, Hex Key Set, Screwdriver Bits, Ratchet Screwdriver, 1/4 in. Adapter, 1/4 in. Bit Holder, 16 oz. Hammer, Torpedo Level, 16 in. Tape Measure, Storage Case<br />
<strong>Price:</strong> $32.99</p>
<p id="description2" style="display: none"><strong>Description:</strong> Werner 6ft fiberglass step ladder. Used to help change light bulbs, reach items on top of your refrigerator, paint walls and ceilings, turn on ceiling fans, the list goes on and on.<br />
<strong>Price:</strong> $59.00</p>
<p id="description3" style="display: none"><strong>Description:</strong> Makita impact driver. Use this powerful, cordless drill to put together household items like tables, chairs, bed frames, kids toys, etc. Also great for hanging blinds, window treatments, and wall decorations. No pre-drilling with this powerful drill.<br />
<strong>Price:</strong> $179.99</p>
<p id="description4" style="display: none"><strong>Description:</strong> Dewalt 7inch circular saw. Cuts 2 x 4 with ease. Throw that hand saw away and save yourself some time and back ache.<br />
<strong>Price:</strong> $169.99</p>
<p id="description5" style="display: none"><strong>Description:</strong> Toro recycler self-propelled lawn mower. Keep your lawn in prestine condition with this easy to use lawn mower. It is self-propelled to make life a little easier on whoever is cutting the grass.<br />
<strong>Price:</strong> $329.99</p>
</td>
</tr>
</table>
</body>
</html>