mostrar y ocultar con una imagen nesecito ayudad

[angel2010]

hola a todos buscando una ayuda para un codigo que es mostrar y ocultar pero el problema que tengo que lo quiero con una imagen como por ejemplo con un icono que tenga una flecha hacia abajo que al mostrar el contenido se cambie la flecha hacia arriba

este es el codigo que tengo funciona pero no como lo quiero

Código HTML:

<script>
 
function abre(){
 
    comprueba=document.getElementById("desaparece").style.display;
 
    if(comprueba=='none')
        document.getElementById("desaparece").style.display="block";
    else
        document.getElementById("desaparece").style.display="none";
}
 
</script>
 
 
 
 
<a href="javascript:abre()"><img src="illustrator-icono.jpg"</a>
 
<div id="desaparece" style="display:none">
aqui aparesera el contenido
</div>
 

[diegovazgonz]

Código HTML:

<script>
     
    function abre(){
     
        comprueba=document.getElementById("desaparece").style.display;
     
        if(comprueba=='none')
            document.getElementById("desaparece").style.display="block";
        else
            document.getElementById("desaparece").style.display="none";
    }
     
    </script>
     
     
     
     
    <a href="javascript:abre()"><img src="illustrator-icono.jpg"></a>
     
    <div id="desaparece" style="display:none">
    aqui aparesera el contenido
    </div>
 

[angel2010]

pero no funciona como yo lo quiero lo quiero hacer que al mostra el contenido se cambi el icono por otro... yo creo que es haci supongamo que al principio esta una flechita haci abajo que al mostra aparesca el icono hacia arriba cu

[angel2010]

esta pagina tiene varios el que yo quiero esta en lo temas que sige hay esta un ejemplo vien claro como lo quiero

que esta en la parte

Temas Suscritos en Carpeta: Temas seguidos en el icono anaranjado

[diegovazgonz]

Código HTML:

<script>
         
        function abre(){
         
            comprueba=document.getElementById("desaparece").style.display;
         
            if(comprueba=='none')
            {
                document.getElementById("desaparece").style.display="block";
                 document.getElementById("open").style.display="none";
                  document.getElementById("close").style.display="block";
                  }
            else
            {
                document.getElementById("desaparece").style.display="none";
                 document.getElementById("open").style.display="block";
                  document.getElementById("close").style.display="none";
        }
         }
        </script>
 
        <a href="javascript:abre()">
        <img id="open" src=""> <!-- imagen mostrar-->
         <img id="close" src="" style="display:none"> <!-- imagen ocultar-->
         </a>
        <div id="desaparece" style="display:none">
        aqui aparesera el contenido
        </div>
 

Lo que hago es cambiar la imagen con el metodo dispaly a la vez que la div

[angel2010]

me funciono a la perfeccion gracias por la ayuda