rak82567
10-31-2010, 09:08 PM
Im new to this and I need to make a website for my computer science class that includes a photo gallery within a table and there has to be two buttons on top so you can scroll through the pictures.. a next and a back button. here is a link to the assignment http://montcs.bloomu.edu/110/Asns/As...-changer.shtml.. here is our teachers example http://myweb.bloomu.edu/rmontant/pictures-project.. I tried to make my website but i am stuck! heres the code for mine and if anybody could tell me what the hell im doing wrong it would be greatly appreciated.. Thanks in advance
<html> <head>
<title>GMC Duramax Photo Gallery</title>
<style type="text/css">
p.pretty{
font-family: "Marker SD" ;
font-size: 20pt ;
}
Img#pix { width:800px;}
table {border-collapse: collapse;
border: 8px inset rgb(255,140,0);
width:800px;
background: rgb(0,0,128);
color: rgb(255,255,255); }
td {border: 1px solid black;
text-align: center;}
</style>
<script type="text/javascript">
var piclist = [
"Chevy1.jpg" ,
"GMC1.jpg" ,
"Ironhide.jpg" ,
"Chevy2.jpg" ,
"Monster.jpg" ,
"DenaliHD.jpg" ,
"DenaliHD1.jpg" ,
"3500HD.jpeg" ,
]
Var i = 0;
function next() {
var elt = document.getElementById "Chevy1.jpg", "GMC1.jpg", "Ironhjide.jpg", "Chevy2.jpg"
el1.src = "images/" + piclist [ i ] ;
el1.style.width = "800px" ;
el1 = document.getElementDyId("caption") ;
el1.innerHTML="number" +i+ ":" piclist[i] ;
i=i+ 1;/
if (i>=piclist.length)
i = 0; }
function prev() {
var elt = document.getElementById("pix") ;
el1.src = "images/" + piclist [ i ] ;
el1.style.width = "800px" ;
el1 = document.getElementDyId("caption") ;
el1.innerHTML="number" -i- ":" piclist[i] ;
i=i+ 1;/" Comment: This counts UP, to next picture. "/
if (i>=piclist.length)
i = 0; }
</script>
</head> <body>
<p class="pretty">
GMC Trucks
</p>
<table>
<tr><td> <button onclick="prev();"> Backward </button> <button onclick="next();"> Forward</button> </td></tr>
<tr><td> <img id="chevy1.jpg" src="Chevy1.jpg"> </td></tr>
<tr><td id="caption"> Lifted Chevy 2500HD</td></tr>
</table>
</body> </html>
<html> <head>
<title>GMC Duramax Photo Gallery</title>
<style type="text/css">
p.pretty{
font-family: "Marker SD" ;
font-size: 20pt ;
}
Img#pix { width:800px;}
table {border-collapse: collapse;
border: 8px inset rgb(255,140,0);
width:800px;
background: rgb(0,0,128);
color: rgb(255,255,255); }
td {border: 1px solid black;
text-align: center;}
</style>
<script type="text/javascript">
var piclist = [
"Chevy1.jpg" ,
"GMC1.jpg" ,
"Ironhide.jpg" ,
"Chevy2.jpg" ,
"Monster.jpg" ,
"DenaliHD.jpg" ,
"DenaliHD1.jpg" ,
"3500HD.jpeg" ,
]
Var i = 0;
function next() {
var elt = document.getElementById "Chevy1.jpg", "GMC1.jpg", "Ironhjide.jpg", "Chevy2.jpg"
el1.src = "images/" + piclist [ i ] ;
el1.style.width = "800px" ;
el1 = document.getElementDyId("caption") ;
el1.innerHTML="number" +i+ ":" piclist[i] ;
i=i+ 1;/
if (i>=piclist.length)
i = 0; }
function prev() {
var elt = document.getElementById("pix") ;
el1.src = "images/" + piclist [ i ] ;
el1.style.width = "800px" ;
el1 = document.getElementDyId("caption") ;
el1.innerHTML="number" -i- ":" piclist[i] ;
i=i+ 1;/" Comment: This counts UP, to next picture. "/
if (i>=piclist.length)
i = 0; }
</script>
</head> <body>
<p class="pretty">
GMC Trucks
</p>
<table>
<tr><td> <button onclick="prev();"> Backward </button> <button onclick="next();"> Forward</button> </td></tr>
<tr><td> <img id="chevy1.jpg" src="Chevy1.jpg"> </td></tr>
<tr><td id="caption"> Lifted Chevy 2500HD</td></tr>
</table>
</body> </html>