Hallo,
ich habe eine Art Bildershow gemacht, wo unter dem Bild eine programierte Scroll-Leiste die Bilder lädt.
Jetzt möchte ich daß wenn das Bild XY geladen wird, Bsp ein bild mit einer Tür, die Tür anklickbar ist. Nur sollte diese Region auf den anderen Bildern nicht existieren. Nachfolgend mein Code.
Gruß Andreas
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title></title>
<script language="javascript">
function imgOn(img_name,img_src) {
document[img_name].src=img_src;
}
function anzeigen(i){
switch (i){
case 1: imgOn("detail","ZimmerBilder/1b1.jpg");break;
case 2: imgOn("detail","ZimmerBilder/1b2.JPG");break;
case 3: imgOn("detail","ZimmerBilder/1b3.JPG");break;
case 4: imgOn("detail","ZimmerBilder/1b4.JPG");break;
case 5: imgOn("detail","ZimmerBilder/1b5.JPG");break;
case 6: imgOn("detail","ZimmerBilder/1b6.JPG");break;
case 7: imgOn("detail","ZimmerBilder/1b7.JPG");break;
case 8: imgOn("detail","ZimmerBilder/1b8.JPG");break;
case 9: imgOn("detail","ZimmerBilder/1b9.JPG");break;
case 10: imgOn("detail","ZimmerBilder/1b10.JPG");break;
case 11: imgOn("detail","ZimmerBilder/1b11.JPG");break;
case 12: imgOn("detail","ZimmerBilder/1b12.JPG");break;
case 13: imgOn("detail","ZimmerBilder/1b13.JPG");break;
}}
</script>
</head>
<body><br>
<h1 align="center">Rundgang durch das Zimmer Nr. 1</h3>
<br>
<P align=center>
<IMG src="ZimmerBilder/1b1.JPG" alt="" name="detail" border=0 height="250" usemap="#Bild"></P>
<table border="0" align="center"><tr>
<td><IMG src="ZimmerBilder/Pfeil_links.JPG" height="25"></td><td>
<table cellpadding="0" cellspacing="0" border="1" bordercolor="0" align="center">
<tr><td><table border="1" cellpadding="0" cellspacing="0"><tr>
<td bgcolor="Teal" width="20" height="20" onMouseOver="anzeigen(1); this.bgColor='Teal'" onMouseOut="this.bgColor='White'"> </td>
<td bgcolor="White" width="20" height="20" onMouseOver="anzeigen(2); this.bgColor='Teal'" onMouseOut="this.bgColor='White'"> </td>
<td bgcolor="White" width="20" height="20" onMouseOver="anzeigen(3); this.bgColor='Teal'" onMouseOut="this.bgColor='White'"> </td>
<td bgcolor="White" width="20" height="20" onMouseOver="anzeigen(4); this.bgColor='Teal'" onMouseOut="this.bgColor='White'"> </td>
<td bgcolor="White" width="20" height="20" onMouseOver="anzeigen(5); this.bgColor='Teal'" onMouseOut="this.bgColor='White'"> </td>
<td bgcolor="White" width="20" height="20" onMouseOver="anzeigen(6); this.bgColor='Teal'" onMouseOut="this.bgColor='White'"> </td>
<td bgcolor="White" width="20" height="20" onMouseOver="anzeigen(7); this.bgColor='Teal'" onMouseOut="this.bgColor='White'"> </td>
<td bgcolor="White" width="20" height="20" onMouseOver="anzeigen(8); this.bgColor='Teal'" onMouseOut="this.bgColor='White'"> </td>
<td bgcolor="White" width="20" height="20" onMouseOver="anzeigen(9); this.bgColor='Teal'" onMouseOut="this.bgColor='White'"> </td>
<td bgcolor="White" width="20" height="20" onMouseOver="anzeigen(10); this.bgColor='Teal'" onMouseOut="this.bgColor='White'"> </td>
<td bgcolor="White" width="20" height="20" onMouseOver="anzeigen(11); this.bgColor='Teal'" onMouseOut="this.bgColor='White'"> </td>
<td bgcolor="White" width="20" height="20" onMouseOver="anzeigen(12); this.bgColor='Teal'" onMouseOut="this.bgColor='White'"> </td>
<td bgcolor="White" width="20" height="20" onMouseOver="anzeigen(13); this.bgColor='Teal'" onMouseOut="this.bgColor='White'"> </td>
</tr></table></td></tr></table></td>
<td><IMG src="ZimmerBilder/Pfeil_rechts.JPG" height="25"></td>
</tr></table>
<MAP NAME="Bild">
<AREA SHAPE=RECT COORDS="50,50,200,150" HREF="RundgangZimmer.hrm" ALT="Zurück zur Zimmerauswahl">
</MAP>
</body>
</html>