Boton con imagen Muestra-Oculta

[RealTincho]

Hola, alguien podria ayudarme?? necesito qe en boton de nombre "BOTON" qe contiene la funcion de Muestra-Oculta sea reemplazado por la imagen de este Link: http://i1211.photobucket.com/albums/cc426/TinchoFdez/1_zps0b509538.png
Osea, qe en vez de tenes qe clickar en "BOTON" tengamos qe clickar en la imagen, manteniendose los valores de Muestra-Oculta... Agradeseria mucho su colaboracion!! :)

Código HTML:

<div style="position: fixed; width: 220px; height: 24px; z-index: 1; left: 0px; top: 11px" id="capa2">

<p>


<title>Muestra oculta</title></p>

<script language="JavaScript">

function muestra_oculta(id){
if (document.getElementById){
var el = document.getElementById(id);
el.style.display = (el.style.display == 'none') ? 'block' : 'none'; 
}
}
window.onload = function(){
muestra_oculta('contenido_a_mostrar');
}
</script>



<form method="get">


<p><a style="cursor: pointer;" onclick="muestra_oculta('contenido_a_mostrar')"><input name="Agregar usuario" type="button" value="BOTON"/></a></p>

<div id="contenido_a_mostrar">

<div style="position: fixed; width: 220px; height: 24px; z-index: 1; left: 65px; top: 12px" id="capa2"><a target="_blank" href="http://www.Friki-Music.com.ar"><img src="http://i1211.photobucket.com/albums/cc426/TinchoFdez/2_zps7118f489.png"/></a>

<script type="text/javascript">var NREUMQ=NREUMQ||[];NREUMQ.push(["mark","firstbyte",new Date().getTime()])</script>

    
    <!--[if !IE]-->
        <!--googleoff: index-->
       
       <!--googleon: index-->
    <!--[endif]-->
    
<script type="text/javascript" src="http://d1ros97qkrwjf5.cloudfront.net/42/eum/rum.js"></script><script type="text/javascript" src="http://beacon-3.newrelic.com/1/c99d7f1ab0?a=248223&be=850&qt=0&ap=9&dc=488&fe=2283&to=ZFAHNkNYXUBQVEUKXF0aNgdDT19WRRhVCkBDVAYKVEs%3D&v=40&jsonp=NREUM.setToken&perf=%7B%22timing%22%3A%7B%22of%22%3A1348381323906%2C%20%22n%22%3A0%2C%20%22u%22%3A466%2C%20%22ue%22%3A466%2C%20%22dl%22%3A706%2C%20%22di%22%3A1349%2C%20%22ds%22%3A1349%2C%20%22de%22%3A1521%2C%20%22dc%22%3A2510%2C%20%22l%22%3A2510%2C%20%22le%22%3A3990%2C%20%22f%22%3A0%2C%20%22dn%22%3A0%2C%20%22dne%22%3A0%2C%20%22c%22%3A95%2C%20%22ce%22%3A202%2C%20%22rq%22%3A203%2C%20%22rp%22%3A447%2C%20%22rpe%22%3A655%7D%2C%20%22navigation%22%3A%7B%7D%7D"></script><p>
</p><p> </p><p><iframe id="htmlComponentFrame24ed" name="htmlComponentFrame24ed" width="487" height="50" scrolling="no" margin="0" marginwidth="0" marginheight="0" frameborder="0" framespacing="0" hspace="0" vspace="0" src="http://www.flashquix.com/embeds/f499ad3e950e4c4797b82b3c1831b2ca?wrap=no&amp;gzip=true&amp;bg=transparent" style="position: fixed; left: 273px; top: 12px; display: block; width: 487px; height: 50px; "></iframe><iframe id="htmlComponentFrame1543" name="htmlComponentFrame1543" width="592" height="54" scrolling="no" margin="0" marginwidth="0" marginheight="0" frameborder="0" framespacing="0" hspace="0" vspace="0" src="http://www.flashquix.com/embeds/6cce3adaf47140e6a48fd55d26983747?wrap=no&amp;gzip=true&amp;bg=transparent" style="position: fixed; left: 189px; top: 23px; display: block; width: 592px; height: 54px; "></iframe></p></div>
</div></form></div> 

[caricatos]

Hola:

En mi opinión es semánticamente incorrecto usar un enlace para "no enlazar". Si solo quieres lanzar un script puedes usar cualquier elemento, incluso directamente esa imagen que quieres poner.

<img onclick="lo_que sea()" style="cursor: pointer" src="la_imagen.png" />

Fíjate que al usar el estilo de "la manita" se crea el efecto de zona caliente.

Saludos

[RealTincho]

Tienes razón, ya lo corregí, muchas gracias!! me sirvio mucho tu ayuda :)
Saludos.