Título: Ayuda SuperCapa como mostrarla y esconderla ? Publicado por: Diabliyo en 17 Enero 2011, 19:20 pm Buenas.
Quier hacer el efecto que se encuentra en muchos sitios que es la de mostrar una supercapa con opacidad en donde esta supercapa ocupa todo el ancho y alto del monitor, el fondo es opaco en negro, y en medio muestra un contenido, por lo general lo usan para mostrar imagenes, a esta capa tambien le adieren una imagen o enlace para cerrar la capa. Buscando la forma de como hacerlo, he logrado mostrar la capa, que ocupe todo el ancho y alto de la dimencion del sitio, se super posiciona encima de todo el sitio, toma el efecto de opacidad y en medio muestro un iframe que contiene la imagen, de esta forma si la imagen es mayor al ancho del que establezco, se pone un scrollbar... y en la parte superior un enlace para cerrar la capa ([Cerrar]). El problema es que, no logro cerrar la capa :(... Vaya, desaparece la imagen que muestro en medio, desaparece el iframe y el mensaje de [Cerrar], pero no desaparece la supercapa con opacidad :( En mi code la funcion supercapa() es invocada por un enlace que pulsa el usuario, que se invoca atraves del evento onclick(), esta invoca dos funciones la funcion que muestra la supercapa() y una funcion de AJAX que escribe los datos en la capa. Código
Cuando se muestra la imagen, el enlace de [Cerrar] invoca la funcion capa_verno() en javascript, que se supone cambia los estilo de visibility y display, si estos estan activados, los desactiva: Código
Título: Re: Ayuda SuperCapa como mostrarla y esconderla ? Publicado por: [u]nsigned en 17 Enero 2011, 23:28 pm Esa 'tecnica' se llama Lightbox, aca te dejo un ejemplo (http://sigt.net/archivo/como-crear-un-lightbox-con-css-y-sin-librerias-javascript.xhtml) de implementacion solo con CSS y JS.
Aunque mejor te recomendaria que uses la libreria jQuery para estas cosas.. Saludos Título: Re: Ayuda SuperCapa como mostrarla y esconderla ? Publicado por: Diabliyo en 17 Enero 2011, 23:44 pm Buenas.
Ya logreo que se cierre la capa, fue mis simple solo agregue dos styles en el javascript y listo, pero el problema ahora es que se aplica la opacidad a toda la capa, vaya, tambien al iframe que lleva dentro. Aqui el code actualizado: Código: function supercapa( capa, color, opacidad ) El style: Código: #supercapa {margin:auto;z-index:7;position:absolute;} Como vemos en el style de arriba, la capa supercapa se muestra ocupando toda la pantalla y con la opacidad establecida, pero la clase child tambien se le aplica esta opacidad :S, porque ?, no entiendo porque tambien se le aplica opacidad, esto hace que se vea mal :( |