hacer una fade in y fade out en el siguiente codigo que funciona

[mensajeescrito]

Hola algún alma caritativa me podría decir donde y que debo poner en el siguiente código para que los divs aparezcan con un fade in y desaparezcan con un fade out?¿


(por que este código funciona y hace aparecer divs pero a pelo, no con fade.

gracias de antemano.

Código Javascript:

<script>
        
          function btn_inicio()   { verOpcion("inicio") }
                  
          function btn_evento() { verOpcion("evento") }
      
          function btn_somos()   { verOpcion("somos") }
 
          function btn_fotos()   { verOpcion("fotos") } 
 
                    function btn_galeria_1_fotos()   { verOpcion("galeria_1_fotos") }
                    
                    function btn_galeria_2_fotos()   { verOpcion("galeria_2_fotos") }
                    
                    function btn_galeria_3_fotos()   { verOpcion("galeria_3_fotos") }
                                        
                    function btn_galeria_4_fotos()   { verOpcion("galeria_4_fotos") }
                                                            
                    function btn_galeria_5_fotos()   { verOpcion("galeria_5_fotos") }
                    
                    
          
          function btn_videos()   { verOpcion("videos") }
          
          function btn_contacto() { verOpcion("contacto") }
          
          function btn_rss() { verOpcion("rss") }
                                                                                      
          function btn_cerrar()   { verOpcion("elementos_web") }          
 
 
             
                  function verOpcion(opcion) {
                    ocultarOpcion();
                    var opcs = document.querySelectorAll(".contenido." + opcion);
                    for(var i=0, length=opcs.length; i<length; i++) {
                     var opc = opcs[i];
                     opc.style.visibility = "visible";
                   }
                 }
             
             
             
                 function ocultarOpcion() {
                   var opcs = document.querySelectorAll(".contenido");
                   for(var i=0, length=opcs.length; i<length; i++) {
                     var opc = opcs[i];
                     opc.style.visibility = "hidden";
                   }
                 }
                 
                                 
                 
                function ocultarOpciones(cual) {
                    
                   var elElemento=document.getElementById(cual);
                   if(elElemento.style.display == 'none') {
                      elElemento.style.display = 'block';
                   }
                }                
 
 
 
                 function ocultarOpcion() {
                   var opcs = document.querySelectorAll(".contenido");
                   for(var i=0, length=opcs.length; i<length; i++) {
                     var opc = opcs[i];
                     opc.style.visibility = "hidden";
                     
                   }
                 }
 
       </script>
 

[quimfv]

Ese codigo es javascript a pelo... para hacer facilmente fade in y fade out mirate jquery (una libreria de funciones javascript)

http://api.jquery.com/fadeIn/

http://api.jquery.com/fadeOut/

[caricatos]

Hola:

En realidad los efectos fade in/out se implementan variando la opacidad de las capas, entre cero y uno para mostrar y viceversa para ocultar, ambas con un temporizador; por ejemplo:

function fadein(id_capa) {
for (i = 0; i < 100; i++)
setTimeout("document.getElementById('" + id_capa + "').style.opacity = " + i, i * 10);
}

Lo puse "a capella", pero controlando bien que la cadena esté bien, o usando tal vez una función intermedia, puedes intentarlo...

Saludos

[mensajeescrito]

Gracias por los enlaces me han servido de mucho.

de hecho he podido reproducirlos siguiendo los ejemplos de los enlaces.

pero mi conocimiento de javascript es muy poco por no decir nulo.

si solo al menos pudieras ponerme el fade in en el primer bloque de codigo yo intentaria hacer lo propio con el resto de codigo si pudiera ser .

muchas gracias .