Galleria immagini javascript

sappe

Galleria immagini javascript

Basandomi su questo script (alistapart.com/articles/imagegallery), volevo creare una galleria immagini.
Il problema è che cliccando sull'immagine stessa, apre solo quella (nella stessa pagina): per spiegarmi meglio, invece di venire visualizzata come una galleria nel sito, appare solo lei.
Questo è il codice che sto usando:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Com'&egrave; composto un libro</title>
<link href="style.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" type="text/css" media="print" href=
"style_stampa.css">
<meta http-equiv="Content-Type" content=
"text/html; charset=us-ascii">
<script type="text/javascript" src="cercaPagina.js">
</script>
<script type="text/javascript" language="javascript">
function showPic (whichpic) {
 if (document.getElementById) {
  document.getElementById('placeholder')»
  .src = whichpic.href;
  if (whichpic.title) {
   document.getElementById('desc')»
  .childNodes[0].nodeValue = whichpic.title;
  } else {
   document.getElementById('desc')»
  .childNodes[0].nodeValue = whichpic.childNodes[0].nodeValue;
  }
  return false;
 } else {
  return true;
 }
}
</script>
</head>
<body>
<div align="center">
<table class="maintable" cellpadding="0" cellspacing="0" summary=
"menu">
<tr>
<td colspan="3"><div id="logo"><img src="immagini/banner.gif" width="727"
height="240" alt=""></div></td>
</tr>
<tr>
<td rowspan="2" class="navbg" valign="top">
<div id="nav">
<p><span class="h2">Menu</span> <a href="index.html">Home</a>
<a href="contatti.html">Contatti</a> <a href=
"bibliografia.html">Bibliografia</a></p>
<hr>
<p><a href="editoriaEditing.html">Editoria e Editing</a> <a href=
"linguaggioEditoriale.html">Linguaggio editoriale</a> <a href=
"figureProfessionali.html">Figure Professionali</a> <a href=
"composizioneLibro.html">Com'&egrave; composto un libro</a>
<a href="normeEditoriali.html">Norme editoriali</a></p>
</div>
</td>
</tr>
<tr>
<td rowspan="2" class="contentbg" valign="top">
<div id="content">
<h1>Com'&egrave; composto un libro</h1>
<p>Ricerca rapida per pagina<input type="text" id=
"searchInput"><button id="performSearch">Cerca</button></p>
<hr>
<h2>Struttura ed elaborazione</h2>
<h3>Struttura</h3>
<h4>TIPI DI COPERTINA</h4>
<p id="desc">Choose an image to begin</p>
<img id="placeholder" src="images/bg.gif" alt="" />
<ul>
<li><a onclick="return showPic(this)" href="images/bananas.jpg" title="A bunch of bananas on a table">some bananas</a></li>
<li><a onclick="return showPic(this)" href="images/condiments.jpg" title="Condiments in a Chinese restaurant">two bottles</a></li>
<li><a onclick="return showPic(this)" href="images/shells.jpg" title="Seashells on a table">some shells</a></li>
</ul>
 .... contenuti ....
</div>
</td>
<td valign="top" class="spacer"></td>
</tr>
<tr>
<td height="2" class="spacer2"></td>
</tr>
<tr>
<td colspan="3" class="creditsbg"></td>
</tr>
</table>
</div>
</body>
</html>

Che sto sbagliando? :S
Grazie infinite per l'aiuto in anticipo!! Scusate se mi blocco sulle cose banali