Javascript

Bonjour,

je suis pas un pro du javascript mais en recopiant un script ainsi que les fonctions nécessaires, lorsque je clique sur suivant ou précèdent l'image reste la même au lieu d'afficher la suivante ou la précédente que faire ?

voici mon code.

<script language="javascript" type="text/javascript" src="biblio/prototype.js"></script>
<script language="javascript" type="text/javascript" src="biblio/scriptaculous/src/scriptaculous.js"></script>
<script language="javascript" type="text/javascript">
compteur=1
flyers=["flyer0001.jpg","flyer0002.jpg","flyer0003.jpg", "flyer0004.jpg","flyer0005.jpg", "flyer0006.jpg", "flyer0007.jpg"]
charge=[]
function precharger()
{
for(i=0;i<flyers.length;i++)
{
objet=new Image()
objet.src="images/"+flyers[i]
charge[i]=objet
}
}
apparaitre=function ()
{

new Effect.Opacity("photo",{from:0.0,to:1.0,duration:1.0})

}
function suivante()
{
new Effect.Opacity(
"photo",
{
from:1.0,
to:0.0,
duration:1.0,
afterFinish:suivantefin
}
)
}
function suivantefin()
{
if(compteur<flyers.length-1)
{
compteur++
$('photo').src=charge[compteur].src

}
new Effect.Opacity("photo",{from:0.0,to:1.0,duration:1.0})

}

function precedente()
{
new Effect.Opacity("photo",{from:1.0,to:0.0,duration:1.0,afterFinish:apparaitre})
if(compteur>0)
{
compteur--
$('photo').src=charge[compteur].src
}
}
</script>

<img src="flyer/flyer0001.jpg" width="280" height="420" align="left" id="photo"/>