Agregar fade a funcion mostrar y ocultar DIV

Un cordial saludo, eh venido utilizando una función para mostrar y ocultar divs y quiero saber si le puede agregar un efecto de fade, esta función me funciona perfecto y la eh aplicado a varios divs dentro de mi sitio, es posible solo adicionarle algunas líneas para que el div se muestre como un fade y no tan rígido, esta es la función que utilizo:

<script language="JavaScript">
function muestra_oculta(id){
if (document.getElementById){ //se obtiene el id
var el = document.getElementById(id); //se define la variable "el" igual a nuestro div
el.style.display = (el.style.display == 'none') ? 'block' : 'none'; //damos un atributo display:none que oculta el div
}
}
window.onload = function(){/*hace que se cargue la función lo que predetermina que div estará oculto hasta llamar a la función nuevamente*/
muestra_oculta('mostrarProducto');/* "mostrarProducto" es el nombre que le dimos al DIV */
muestra_oculta('div1');
muestra_oculta('div2');
muestra_oculta('div3');

}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
</script>

Muchas gracias por su ayuda.

buenas,
cambias el style.opacity poco a poco, o usa Jquery, es muy fácil y tiene un fadein/out muy conseguido.

Saludos