Jump to content

[SOLUCIONADO] Abrir página dinámica con fancybox


OPS

Recommended Posts

Buenas de nuevo y gracias por anticipado.

 

En esta ocasión el problema que tengo es para abrir una página dinámica con fancybox.

 

En condiciones normales podemos abrir la página con el siguiente código

 

<script type="text/javascript">

$(document).ready(function(){

$(".miclase").fancybox({

'autoScale' : false,

'transitionIn' : 'none',

'transitionOut' : 'none',

'width' : 680,

'height' : 450,

'type' : 'iframe'

});

});

</script>

 

<a class="miclase" href="mipagina.html">Abrir página</a>

 

Este código abre sin problema la página web mipagina.html con efecto fancybox incorporado.

 

Ahora bien, lo que necesito hacer es abrir una página creada por nosotros dinámicamente, es decir, creada mediante script con una función de este tipo

 

<SCRIPT LANGUAGE="JavaScript">

<!--

var nueva = null

function NuevaVentana()

{

nueva = window.open("", "", "resizable, width=300, height=300")

nueva.document.open()

nueva.document.writeln("<

HTML><HEAD><TITLE>Documento Creado</TITLE></HEAD>")

nueva.document.writeln("<BODY><H1>Mi título</H1>")

nueva.document.writeln("<IMG SRC='uno.gif' HEIGHT='15' WIDTH='15'>")

nueva.document.writeln("<H2>Mis productos, etc</H2>")

nueva.document.write("</BODY></HTML>")

nueva.document.close()

}

//-->

 

 

Los parámetros de la función window.open son:

 

window.open(URL,nombre_de_la_ventana,forma_de_la_ventana)

 

He probado a incorporar un nombre a la ventana pero igualmente no me la abre, por ejemplo.

 

nueva = window.open("", "mipagina", "resizable, width=300, height=300")

 

El problema es que no consigo abrir esta nueva ventana con el efecto fancybox.

 

Por último añadir que necesito abrir esta ventana dinámica desde la página product-list-tpl

 

Agradezco cualquier ayuda. Un saludo.

Edited by OPS (see edit history)
Link to comment
Share on other sites

Buenas a todos

 

Finalmente revisando la biblioteca de fancybox he visto que puedo generar el contenido antes de pasarselo y con eso ya me vale. Os dejo el código para hacerlo que seguro que a alguien le valdrá en algún momento.

 

<script type="text/javascript">

$(document).ready(function() {

$("#Mi_contenido").fancybox();

});

</script>

 

 

<a id="Mi_contenido" href="#contenido" title="Título de la ventana de fancybox"> Texto sobre el que clickar para abrir la ventana</a>

<div id=contenido>

Aquí ponemos el contenido de la ventana

</div>

 

Con este código, al hacer click en el enlace Texto sobre el que clickar para abrir la ventana se lanzará automáticamente el efecto fancybox sobre el contenido que añamos definido para dicha ventana.

 

No obstante, me queda una duda que resolver con esta funcionalidad. Tengo la página organizada en 3 columnas, la de la izquierda es la de las categorías y la central es la que lista la relación de productos de la categoría seleccionada. Pues bien, el efecto fancybox solo me funciona sobre el primer producto de la lista a la que lo aplico por cada categoría.

 

la página por si alguie puede echarle un vistazo es la siguiente: http://www.chapaypinturafranciscoleon.com/prestashop

 

Si váis a la categoría "Precocinados" veréis que hay dos productos y que ambos están marcados como oferta. Al pulsar sobre el primer botón de añadir a la cesta, el del producto "Bocaditos de rosada" comprobaréis que el efecto funciona, pero al hacerlo sobre el botón de "churros" veréis que no funciona.

 

¿alguien me puede orientar por qué solo funciona el primer botón?

 

Muchas gracias.

Link to comment
Share on other sites

Buenas denuevo

 

Pues parece que al final tenía un error en el código anterior, para que funcione con todos los enlaces de la misma página el código correcto para el plugin fancybox es el siguiente:

 

<script type="text/javascript">

$(document).ready(function() {

$("a#Mi_contenido").fancybox();

});

</script>

 

¡¡¡Faltaba una a!!!!

 

Cerramos el hilo.

Link to comment
Share on other sites

Buenas Victor

 

Lo he subido un nivel hasta discusión general pero no veo como llevarlo al apartado que me comentas.

Simplemente crea un tema nuevo, en la sección que te he comentado indicando tu aporte.

  • Like 1
Link to comment
Share on other sites

Guest
This topic is now closed to further replies.
×
×
  • Create New...