Fancy Box Popup

[SergioE]

Buenas,

Tengo un PopUp , con este codigo y me interesa que este pop up salga en pantalla tras 5 segundos por ejemplo, estoy intentando hacer con una funcion que dejo aqui abajo junto al codigo y no me funciona..

{literal}

<script type="text/javascript">
jQuery(document).ready(function() {
	$.fancybox(
		'{/literal}{$content}{literal}',
		{
			'width'			    : 650,
			'height'		    : 400,
			'autoScale'  		: true,
			'scrolling'  		: 'no'
		});
		
		window.setTimeout('$("#fancybox-skin")', 5000);
});
</script>

{/literal}

Gracias!

Edited February 12, 2016 by SergioE (see edit history)

[SergioE]

He logrado hacerlo con esta funcion:

{if isset($content) AND $content}

{literal}

<script type="text/javascript">
jQuery(document).ready(function() {
       setTimeout(function () {
                $.fancybox.open(
				'{/literal}{$content}{literal}',
                        {
                                                        'width'		        : 650,
							'height'	   	        : 400,
							'autoScale'  		: true,
							'autoDimensions'        : true,
        					        'centerOnScroll'        : true,
							'scrolling'  		: 'no'
							
                        }    
                    
                );
        }, 500);
    });
</script>

{/literal}

{/if}

Pero ahora quiero hacer que limite esta salida del PopUp solo una vez, que solo salga una vez cuando se cargue la web por usuario... como se haría eso?

 

Gracias

Edited February 12, 2016 by SergioE (see edit history)

[SergioE]

Up

[Rolige]

Hazlo con este codigo...

{if isset($content) AND $content}
	<script type="text/javascript" src="//cdn.jsdelivr.net/jquery.cookie/1.4.1/jquery.cookie.min.js"></script>
	{literal}
	<script type="text/javascript">
		$(document).ready(function() {
			if (typeof $.cookie('FancyBoxPopup') == 'undefined') {
				$.cookie('FancyBoxPopup', 1);
				setTimeout(function () {
					$.fancybox.open(
						'{/literal}{$content}{literal}',
						{
							'width'			: 650,
							'height'		: 400,
							'autoScale'  		: true,
							'autoDimensions'	: true,
							'centerOnScroll'	: true,
							'scrolling'  		: 'no'
							
						}
					);
				}, 500);
			}
		});
	</script>
	{/literal}
{/if}

Edited February 12, 2016 by COTOKO (see edit history)

[SergioE]

Funciona a la perfección, gracias COTOKO!

[SergioE]

Puedo desde ese archivo decirle que baje el width y height cuando la web sea vista desde un dispositivo movil? Hay alguna manera?

 

Pues este modulo de PopUp no es responsive y en el codigo del modulo no me deja poner nada de eso supongo.

[ventura]

Para hacerlo responsive ponle las medidas en porcentaje y añadele valores minimos, ejemplo

minWidth    : 550,
minHeight   : 500,
width       : '60%',
height      : '75%',

[SergioE]

Pero ese código donde lo pongo? El código actual es el que tiene COTOKO, donde iria eso para el responsive?

{if isset($content) AND $content}
	<script type="text/javascript" src="//cdn.jsdelivr.net/jquery.cookie/1.4.1/jquery.cookie.min.js"></script>
	{literal}
	<script type="text/javascript">
		$(document).ready(function() {
			if (typeof $.cookie('FancyBoxPopup') == 'undefined') {
				$.cookie('FancyBoxPopup', 1);
				setTimeout(function () {
					$.fancybox.open(
						'{/literal}{$content}{literal}',
						{
							'width'			: 650,
							'height'		: 400,
							'autoScale'  		: true,
							'autoDimensions'	: true,
							'centerOnScroll'	: true,
							'scrolling'  		: 'no'
							
						}
					);
				}, 7000);
			}
			
			 if(jQuery(window).width() < 767) {
    			$.fancybox('{/literal}{$content}{literal}',
					{
						'minWidth'		    : 550,
						'minHeight'		    : 500,
						'width'  			: '60%',
						'height'  			: '75%'
			});
		  };
		});
	</script>
	{/literal}
{/if}

Esto estaria bien?

Edited February 13, 2016 by SergioE (see edit history)

[ventura]

En estos valores que tienes

'width'			: 650,
'height'		: 400,
'autoScale'  		: true,
'autoDimensions'	: true,
'centerOnScroll'	: true,
'scrolling'  		: 'no'

cambia los valores de tamaño que tienes en px  (600, 400) por % ( 60%, 50%, por ejemplo) y añade tambien los valores minimos comentados antes, no añadas condicionales de tamaño de ventana, no es necesario