En esta oportunidad voy a mostrar tres opciones que me han sido muy útiles y que creo todo diseñador web que utilice shadowbox debiera conocer. se trata de DisplayNav, enableKey y Modal. Pasen pasen 
Estas tres opciones pueden ser muy utiles, sobre todo a la hora de asegurarnos de que el usuario no cierre el shadowbox por error.
Shadowbox por defecto trae estas tres opciones configuradas, lo que mostrare es como dar vuelta esa configuración a nuestro beneficio.
displayNav: mediante esta opcion controlamos el boton de cerrar, con esto podemos hacer que se deshabilite o habilite el link de cerrar.
enableKeys: esta opciones muy buena, ya que shadowbox maneja control de teclas, como se habrán dado cuenta, por ejemplo con la tecla escape cerramos el contenedor shadowbox. Bueno, con esta opción podemos deshabilitarlo evitando que el usuario cierre por error el contenedor.
modal: mediante la opción modal podemos hacer que el usuario al hacer clic fuera del contenedor lo cierre. Bueno esto tambien lo podemos controlar y poder evitar que si hace clic fuera, el contenedor no se cierre.
dejo un ejemplo donde esta todo bloqueado, es decir, las teclas deshabilitadas, modal deshabilitado y link cerrar deshabilitado.
<script type="text/javascript">// <![CDATA[
Shadowbox.init({
language: "es",
displayNav: false, // Para deshabilitar link de cerrar
enableKeys: false, // Para deshabilitar teclado, evitar Escape
modal: true, // Para deshabilitar que el usuario haga clic fuera para cerrar
players: ['img', 'html', 'iframe', 'qt', 'wmp', 'swf', 'flv']
});
// ]]></script>
Cerrar Shadowbox
Si quieres ver mas opciones para configurar en shadowbox pincha aqui
Eso es todo, les dejo dos links, uno para ver el demo y otro para descargar el ejemplo.
Saludos, Chichote
Artículos Relacionados:
- Refrescar página al cerrar Shadowbox ¿Como refrescar pagina al cerrar shadowbox?. Un tips muy util...
- Shadowbox, para mi es el definitivo Andres Nieto publico hace ya tiempo en su web "Shadowbox,...
- Levantar Shadowbox al abrir la pagina (shadowbox open url) Este articulo presentare la manera de Levantar el contenedor Shadowbox...
- Pasar variable desde Shadowbox a ventana padre o contenedora. Esta es una opcion muy util para crear selectores, por...
Related posts brought to you by Yet Another Related Posts Plugin.
2 Comentarios
Hola, antes que nada me parece excelente tu pagina la verdad es de gran ayuda. Pero a ver si me puedes auxiliar, lo que pasa es que en mi pagina (wordpress) subo las imagenes de lo que publico por medio de photobucket para no utilizar memoria de mi servidor, instale el shadowbox y al hacer click en alguna imagen no carga nada y se queda en negro, hay alguna manera de corregir esto? de ante mano muchas gracias.
Una consulta Adrian, veo que estas trabajando con un plugins sobre shadowbox en tu wordpress, es asi? la verdad es que yo no he trabajado con algun plugins, siempre he trabajado shadowbox en duro, es decir directo sobre la plantilla, es mas facil integrar, hechale un vistaso a este articulo, es muy simple lo unico que cambiaria es la ruta hacia los archivos shadowbox.js y css, debes asignarle la ruta de tu theme con la funcion , supongamos que dentro de tu theme tienes un directorio llamado shadowbox y dentro todos los archivos perteneciente a este, entonces en el header de tu blog quedaria la definicion de shadowbox asi:
<script type="text/javascript" src="<? echo get_bloginfo('template_directory')?>/shadowbox/shadowbox.js"></script>
<script type="text/javascript">
Shadowbox.init({
language: "es",
players: ['img', 'html', 'iframe', 'qt', 'wmp', 'swf', 'flv']
});
</script>
luego para llamar a una imagen con shadowbox es muy simple:
saludos, espero te sirva.
de todos modos revisa los otros articulos sobre shadowbox que tengo, te daran pistas.