Condiciones para que aparezcan unos botones o otros (HTML; javascript)

Hola a todos,
tenia una pregunta un tanto rara...
Pero primero me explico un poco.
Estoy haciendo una pag en html con un caxo de javascript integrado para poder pasar mapas al darle a unos botones que estan creados.
La cuestión es que dependiendo de la imagen que muestras o a partir de una imagen, me gustaria que esos botones pasaran a ser otros jeje
Me explico un poco mal quizás pero en mi cabeza lo veo jeje
Os paso el script, cabe mencionar que he simplificado muchas cosas del script original ya que tampoco es necesario para esta duda y además tendria que adjuntar un script muy largo. El tema es que tenemos unos mapas con unos botones abajo que muestras la posibilidad de pasar imagen a imagen(+3h) o (+24h) que son unos 7 imagenes de golpe, también puedes ir hacia atrás. Llega un momento a partir de la imagen con j=48 que su siguiente imagen será otra y a partr de aquí las imagen son de 6h en 6h horas no de 3h en 3h horas como las anteriores y como marca el boton de +3h. La cuestión real es que quiero que cuando llegue a la última imagen de las imagenes que van de 3h en 3h, el boton de +3h se transforme en uno de +6h y pase a tener la utilidad de uno de 6h, claro.
Supongo que esto lo podria conseguir con un IF donde estan los botones que diga: Si j>48 el boton de +3h será de +6h, pero no se como programarlo.

<html>
<head>
<script>



   i = 1
   e = 24
   total = 240
   n=3
   g=0
function animacion(masmenos){
   if(masmenos=="ini0"){g=0;e=e; n=n; i=i+4;}
   if(masmenos=="ini12"){g=12;e=e; n=n; i=i-4;}
   if(masmenos=="mas"){g=g;e=e-3; n=n; i=i-1;}



   if(masmenos=="mass"){g=g;e=e-24; n=n; i=i-7;}
   if(masmenos=="menoss"){g=g;e=e+3; n=n; i=i+1;}
   if(masmenos=="menos"){g=g;e=e+24; n=n; i=i+7;}


   if(masmenos=="Inici"){i=1;e=0; }
   if(i>21) i=21;
   if(i<1) i=1;

   if(n!=1) n=1;

   if(e>total) e=total;
   if(e<0) e=0;

       if(n==1){
j=3*(i-1);

if(j<=48){
if(g==0){
arxiu="http://www.meteo.cat/servmet/modelitzacio/mm5p0"+g+"/"+j+"slpv.gif";}
else{
arxiu="http://www.meteo.cat/servmet/modelitzacio/mm5p"+g+"/"+j+"slpv.gif";}
}
else{
if(g==0){
arxiu="http://www.meteo.cat/servmet/modelitzacio/mm5g0"+g+"/"+j+"slpv.gif";}
else{
arxiu="http://www.meteo.cat/servmet/modelitzacio/mm5g"+g+"/"+j+"slpv.gif";}
}

};

document.images[0].src = arxiu;
}

</script>
</head>



<body bgcolor="#FF2345" onLoad="animacion('mas')">
<center>
<form name=num1>
<b>Inici del model</b>
<input type="button" value="00" name="ini0" onclick="animacion('ini0')">
<input type="button" value="12" name="ini12" onclick="animacion('ini12')"><br>

<img border="2" src="" ><br>

<input type="button" value="-24h" name="mass" onclick="animacion('mass')">

<input type="button" value="-3h" name="mas" onclick="animacion('mas')">

<input type="button" value="Inici" name="Inici" onclick="animacion('Inici')">

<input type="button" value="+3h" name="menos" onclick="animacion('menoss')">

<input type="button" value="+24h" name="menoss" onclick="animacion('menos')">

</center>
</form>

</center>

</body>
</html>