Mostrar las páginas Web dentro de una caja de luz fotograma utilizando un script que soporta iframes.
Álbum DISPLAY
Una caja de luz, también conocida como una ventana modal, es una hermosa manera de mostrar el contenido vinculado, como imágenes, formularios y cuadros de diálogo mediante la superposición de ellos en la página principal de su sitio web. Esto puede ayudar a mantener la atención de sus visitantes sobre el contenido y mejorar la usabilidad de la página. Por su diseño, la mayoría lightbox scripts y plugins están codificados paramostrar texto o contenido basado en imágenes. Para mostrar otra página Web, tiene que elegir un guión que apoya específicamente la etiqueta HTML "iframe".
Descargar e instalar el "PrettyPhoto" plugin de jQuery, que es una versión mejorada del script lightbox jQuery original que apoya mostrar páginas Web. Si utiliza una plataforma de publicación en línea, como Drupal o WordPress, puedes instalar PrettyPhoto automáticamente a través de un plugin o módulo.
Abra la página que contiene el vínculo o elemento que desea tener abierta la página web externa utilizando editor en línea de su plataforma de publicación. Alternativamente, abra el documento en un editor de texto o HTML.
Eliminar los "href unas" etiquetas existentes en el vínculo o elemento y reemplazarlo por uno nuevo que se parece a esto:
a href = "#" rel = "width PrettyPhoto" = altura "X" = "X"
Sustitúyase "#" con la URL de la página que desea mostrar en su caja de luz. Sustituya "X" con la altura y el ancho que desee el marco lightbox sea. Es importante que la altura y la anchura de ser lo suficientemente grande para mostrar todo el contenido, pero no superar la altura y la anchura de la resolución de pantalla de su visitante. Dado que esto es difícil de predecir, tratar de usar los marcos que no son más grandes de 1000 píxeles de ancho por 700 píxeles de alto.
Coloca el cursor al final de la URL y escriba el "iframe = true?" Perameter. Por ejemplo, el enlace final debe ser algo como esto:
a href = "http://www.mysite.com/page.html?iframe=true" rel = "width PrettyPhoto" = altura "800" = texto o elemento de "600" Link HTML va aquí / a
El "? Iframe = true" cuenta la secuencia de comandos para inicializar la compatibilidad para tirar de contenido externo, y el atributo relativo "PrettyPhoto" dice jQuery para abrir el enlace con la caja de luz.
Consejos y advertencias
Usted puede crear su propia caja de luz usando sólo los estilos CSS mediante la creación de un contenedor oculto para su iframe y ajuste de la URL de destino de su vínculo con el contenedor oculto. Con el parámetro "ontarget" en tus estilos CSS, usted puede conseguir su elemento de enlace para mostrar el contenedor oculto con un clic sin necesidad de utilizar ninguna JavaScript.
No hay comentarios:
Publicar un comentario