modal example div close jquery popup

example - jquery popup overlay



Mostrar jQuery popup una vez por visitante (3)

establecer un conjunto de cookies para que expire al final de la sesión con un valor de 1 o verdadero o lo que sea. Luego busca galletas. Si existe, no lo muestres.

¿Cómo hago para que este script solo se ejecute si la persona es un nuevo visitante del sitio? Se ejecuta cada vez que se solicita la página que se vuelve muy molesto.

//0 means disabled; 1 means enabled; var popupStatus = 0; function loadPopup(){ //loads popup only if it is disabled if(popupStatus==0){ $("#backgroundPopup").css({ "opacity": "0.7" }); $("#backgroundPopup").fadeIn("slow"); $("#popupContact").fadeIn("slow"); popupStatus = 1; } } //disabling popup with jQuery magic! function disablePopup(){ //disables popup only if it is enabled if(popupStatus==1){ $("#backgroundPopup").fadeOut("slow"); $("#popupContact").fadeOut("slow"); popupStatus = 0; } } //centering popup function centerPopup(){ //request data for centering var windowWidth = document.documentElement.clientWidth; var windowHeight = document.documentElement.clientHeight; var popupHeight = $("#popupContact").height(); var popupWidth = $("#popupContact").width(); //centering $("#popupContact").css({ "position": "absolute", "top": windowHeight/2-popupHeight/2, "left": windowWidth/2-popupWidth/2 }); //only need force for IE6 $("#backgroundPopup").css({ "height": windowHeight }); } $(document).ready(function(){ //LOADING POPUP //Click the button event! //centering with css centerPopup(); //load popup loadPopup(); //CLOSING POPUP //Click the x event! $("#popupContactClose").click(function(){ disablePopup(); }); //Click out event! $("#backgroundPopup").click(function(){ disablePopup(); }); //Press Escape event! $(document).keypress(function(e){ if(e.keyCode==27 && popupStatus==1){ disablePopup(); } }); });


Use cookies si desea un método puramente del lado del cliente. Establezca una bandera que indique que el usuario ya ha visto su introducción o lo que sea.

En el caso de un sitio con algún tipo de autenticación, esto podría ser manejado por el servidor.

¡Dios te bendiga!


Como ya se dijo, necesita crear una cookie la primera vez que un usuario ve la página y luego verificar que la cookie exista en otras visitas.

El JavaScript para crear cookies no es tan fácil como podría ser porque necesita establecer una cadena con un formato preciso. Es más fácil usar estas funciones auxiliares que se pueden encontrar en Quirksmode :

function createCookie(name,value,days) { if (days) { var date = new Date(); date.setTime(date.getTime()+(days*24*60*60*1000)); var expires = "; expires="+date.toGMTString(); } else var expires = ""; document.cookie = name+"="+value+expires+"; path=/"; } function readCookie(name) { var nameEQ = name + "="; var ca = document.cookie.split('';''); for(var i=0;i < ca.length;i++) { var c = ca[i]; while (c.charAt(0)=='' '') c = c.substring(1,c.length); if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length); } return null; }

Luego, en tu código todo lo que tienes que hacer es:

if(readCookie("popupShown") == null) { // Create cookie for 30 days createCookie("popupShown", 1, 30); yourPopupFunction(); }