Ventanas emergentes GreyBox

Escrito por Maverick el . Posteado en Informatica

I. Introducción

Esta librería ofrece múltiples posibilidades. De hecho, acepta tanto la inserción de imágenes como de páginas web. Y no solo con el mismo formato de página sino que existen diferentes tipos. Esto se resume en dos tipos de usos: un uso básico y un uso avanzado.

  • Uso básico: Se centran exclusivamente en la apertura de imágenes y páginas web en dos formatos: Como imagen o web suelta o formando parte de una galería.
  • Uso avanzado: Explican métodos que se les puede pasar al enlace de forma que adquiera mayor funcionalidad. Por ejemplo: GB_show, GB_showCenter, etc.

La forma de usar la librería, tanto en su uso básico como en uso avanzado es el mismo. Lo único que cambia es el enlace al cual se hace referencia.

II. Uso de la librería

Una vez descargada la librería en la carpeta que considere oportuno, deberá hacer referencia a una variable que usa esta librería: GB_ROOT_DIR. Esto se realiza en la cabecera de la web. Básicamente consiste en una variable que luego usa la librería para tomar como directorio raiz la ruta completa desde el raiz hasta la carpeta donde se encuentre la librería:

<script type=”text/javascript”> var GB_ROOT_DIR = “carpetas/hasta/directorio/librería/“; </script>

A continuación, escribir las referencias a los ficheros que vamos a usar de la librería:

<script type=”text/javascript” src=”greybox/AJS.js” mce_src=”greybox/AJS.js”></script> <script type=”text/javascript” src=”greybox/AJS_fx.js” mce_src=”greybox/AJS_fx.js”></script> <script type=”text/javascript” src=”greybox/gb_scripts.js” mce_src=”greybox/gb_scripts.js”></script> <link href=”greybox/gb_styles.css” mce_href=”greybox/gb_styles.css” rel=”stylesheet” type=”text/css” />

Para terminar, el enlace que llame a la librería. En este caso, son múltiples las posibilidades pues se le puede pasar el ancho y el alto de la ventana y numerosos parámetros para configurar más a tu gusto la ventana emergente. Algunos ejemplos de su uso:

  • Acceso básico:
<a href=”URL” mce_href=”URL” title=”CAPTION” rel=”gb_image[]“>HTML</a>
  • Coloco el título de la imagen:
<a href=”URL” mce_href=”URL” title=”CAPTION” rel=”gb_imageset[NAME]“>HTML</a>
  • Selecciono ancho y alto:
<a href=”URL” mce_href=”URL” title=”CAPTION” rel=”gb_page[WIDTH, HEIGHT]“>HTML</a>
  • Selecciono ancho y alto y centro la ventana:
<a href=”URL” mce_href=”URL” title=”CAPTION” rel=”gb_page_center[WIDTH, HEIGHT]“>HTML</a>
  • Ventana a tamaño completo:
<a href=”URL” mce_href=”URL” title=”CAPTION” rel=”gb_page_fs[]“>HTML</a>
  • Webs en formato Galeria:
<a href=”URL” mce_href=”URL” title=”CAPTION” rel=”gb_pageset[NAME]“>HTML</a>

Como siempre digo, todo esto es una pequeña referencia. Si quereis comprobar el auténtico potencial (sobre todo para el acceso avanzado), resultaría muy conveniente que accedieráis al enlace que os he facilitado.

Descarga: GreyBox

Enlace: GreyBox

Via : Codigo al descubierto

Share

Etiquetas:, , , ,

Comentarios (1)

  • Edson

    |

    Muy buen aporte, pero tengo el siguiente problema: realizo todos los pasos requeridos pero la ventana no se ejecuta eso en Mozilla pero en el Explorer funciona de manera normal por que sucede ese inconveniente.
    gracias de antemano.

    Responder

Deja un comentario

SXInformatica
C/Soria 5 25200 Cervera
973 534 445
info@sxinformatica.net

PCmode
www.pcmode.net
635 824 172
ventas@pcmode.net
SEO Powered by Platinum SEO from Techblissonline