Dit is mijn code atm de afbeelding heb ik ook geupload. Zou iemand mij kunnen vertellen hoe ik die afbeeldingen nu het makkelijkst in het midden kan zetten?
De afbeeldingen worden ingeladen bij
[js]var myimages=[][/js]
Hoe kan ik dit het makkelijkste doen? Met vriendelijke groeten Stefan
De afbeeldingen worden ingeladen bij
[js]var myimages=[][/js]
Hoe kan ik dit het makkelijkste doen? Met vriendelijke groeten Stefan
HTML:
<html>
<head>
<link rel= "stylesheet" type="text/css" href="layout.css" />
<title></title>
</head>
<body>
<!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" xml:lang="en" lang="en">
<head>
<title></title>
<script type="text/javascript">
/*<![CDATA[*/
var myimages=[
['http://www.elsema.com/photos/fobblk.jpg',['FOB43301','1-Button, Keyring Remote'],['FOB43301L','1-Large Button, Keyring Remote'],['FOB43302','2-Button, Keyring Remote',''],['FOB43304','4-Button, Keyring Remote',''],['FOB43305','5-Button, Keyring Remote','']],
['http://www.elsema.com/photos/fobblk.jpg',['FOB43301BLACK','1-Button, Keyring Remote Black'],['FOB43301LBLACK','1-Large Button, Keyring Remote Black'],['FOB43302BLACK','2-Button, Keyring Remote Black',''],['FOB43304BLACK','4-Button, Keyring Remote Black',''],['FOB43305BLACK','5-Button, Keyring Remote Black','']],
['http://www.elsema.com/photos/fobblu.jpg',['FOB43301BLUE','1-Button, Keyring Remote Blue'],['FOB43301LBLUE','1-Large Button, Keyring Remote Blue'],['FOB43302BLUE','2-Button, Keyring Remote Blue',''],['FOB43304BLUE','4-Button, Keyring Remote Blue',''],['FOB43305BLUE','5-Button, Keyring Remote Blue','']],
['http://www.elsema.com/photos/fobred.jpg',['FOB43301RED','1-Button, Keyring Remote Red'],['FOB43301LRED','1-Large Button, Keyring Remote Red'],['FOB43302RED','2-Button, Keyring Remote Red',''],['FOB43304RED','4-Button, Keyring Remote Red',''],['FOB43305RED','5-Button, Keyring Remote Red','']]
];
for (var src,z0=0;z0<myimages.length;z0++){
src=myimages[z0][0];
myimages[z0][0]=new Image();
myimages[z0][0].src=src;
}
function changeimage(a){
document.getElementById('targetimage').src=a[0].src;
var r=document.getElementById('mytable').rows ;
for (var r=document.getElementById('mytable').rows,c,z0=1;z0<r.length;z0++){
c=r[z0].cells;
c[0].innerHTML=a[z0][0];
c[1].innerHTML=a[z0][1];
}
}
/*]]>*/
</script>
</head>
<body>
<p>
<table border ="1" align="center">
<tr>
<td><a href="#" onMouseover="changeimage(myimages[0],this.href)";>Project 0</a></td>
</tr>
<tr>
<td><a href="#" onMouseover="changeimage(myimages[1],this.href) ">Project 1</a></td>
</tr>
<tr>
<td><a href="#" onMouseover="changeimage(myimages[2],this.href)";>Project 2</a></td>
</tr>
<tr>
<td><a href="#" onMouseover="changeimage(myimages[3],this.href)";>Project 3</a></td>
</tr>
</table>
<p> </p>
<p> <p><a href="javascript:warp()"><img src="http://www.elsema.com/auto/../photos/foborg.jpg" id="targetimage" border=0></a><br />
</p> </p>
<table width="562" border="1" align="center" id="mytable" >
<tr bgcolor="#FF6633">
<th width="132" bgcolor="#FF9933" scope="col">Part Number</th>
<th width="361" bgcolor="#FF9933" scope="col">Description </th>
</tr>
<tr>
<td><strong>FOB43301</strong></td>
<td>1-Button, Keyring Remote </td>
</tr>
<tr>
<td><strong>Contact</strong></td>
<td>1-Large Button, Keyring Remote1 </td>
</tr>
<tr>
<td><strong>FOB43302</strong></td>
<td>2-Button, Keyring Remote </td>
</tr>
<tr>
<td><strong>FOB43304</strong></td>
<td>4-Button, Keyring Remote </td>
</tr>
<tr>
<td><strong>FOB43305</strong></td>
<td>5-Button, Keyring Remote </td>
</tr>
</table>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
</div>
</body>
</html>
</body>
</html>Bijlagen
Laatst bewerkt door een moderator:
het heeft gewerkt
