[Resolvido] Mostrar janela modal 1 vez com cookie

[Roberto Medina 0]

Olá, estou tentando criar uma janela modal para meu site adulto, para ela funcionar como um aviso de conteúdo +18. Porém nao estou conseguindo fazer ela abrir só uma vez. preciso de ajuda, depois de dias procurando e nao conseguir fazer ou montar os cookie.

 

Não entendo quase nada de javascript, se alguem poder me ajudar ja agradeço.

 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>
<script type="text/javascript">

$(document).ready(function() {	
launchWindow('#dialog1');
$('.window .close').click(function (e) {
e.preventDefault();
$('#mask').hide();
$('.window').hide();
});	
});
function launchWindow(id) {
var maskHeight = $(document).height();
var maskWidth = $(window).width();
$('#mask').css({'width':maskWidth,'height':maskHeight});
$('#mask').fadeIn(0);	
$('#mask').fadeTo("fast",0.8);	
var winH = $(window).height();
var winW = $(window).width();
$(id).css('top',  winH/2-$(id).height());
$(id).css('left', winW/2-$(id).width()/2);
$(id).fadeIn(0); 
}
</script>

<style type="text/css">
body {
font-family:verdana;
font-size:15px;
}

a {color:#333; text-decoration:none}
a:hover {color:#ccc; text-decoration:none}


#mask {
 position:absolute;
 left:0;
 top:0;
 z-index:9000;
 background-color:#000;
 display:none;
}

#boxes .window {
 position:absolute;
 left:0;
 top:0;
 width:0px;
 height:0px;
 display:none;
 z-index:9999;
 padding:20px;
}

#boxes #dialog1 {
 position:absolute;
background-color:#333;
color: #fff;
 width:675px;
 height:453px;
 padding-top:250px;

}

</style>

<br /><script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script>
<br />
<br /><div id="boxes">
<br />  <div id="dialog1" class="window" align="center"  >
<br />    ATENÇÃO: ESTE SITE É PROIBIDO PARA MENORES DE 18 ANOS.<br />
Se você não atingiu ainda 18 anos NÃO PROSSIGA!!!<br />	 Os autores e anunciantes deste site não se responsabilizam pelas conseqüências da decisão do visitante de ultrapassar este ponto.<br />
<br />		Ao clicar em Sou maior de idade, você concorda que é maior de 18 anos.
<br /><br />			<input type="button" value="Sou maior de idade" class="close"/>
<br />		<form id="formurl" name="formurl" action="http://www.google.com" target="_top">
<br />		  <input value="Sou menor de idade" onclick="document.getElementById('formurl').submit()" type="submit" />
<br /><br />
This site contains adult content. DO NOT ENTER if you´re under the age of 18, if you live in a country, province or state whose laws prohibit the viewing of any such related material. <br />		</form>
</div>
<br />	<div id="mask"></div>
<br /></div>

[Henrique Barcelos 290]

:seta: http://www.fricardo.com/manipulando-cookies-com-jquery/

[Roberto Medina 0]

ja tinha entrado nesse link antes porem nao consegui. mais mesmo assim obrigado.

[P@trique 0]

:thumbsup:

 

Neste caso acho que não precisa de jquery, por ser uma coisa simples, então faça a criação e verificação do cookie em javascript puro, ficaria assim:

 

<script type="text/javascript">
   function setCookie(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 getCookie(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;
   }

   $(document).ready(function () {

       var box = getCookie('janela_modal');

       if (box == null) {
           launchWindow('#dialog1');
           $('.window .close').click(function (e) {
               e.preventDefault();
               $('#mask').hide();
               $('.window').hide();
           });
           setCookie('janela_modal', 'visitou', 1);
       }
   });

   function launchWindow(id) {
       var maskHeight = $(document).height();
       var maskWidth = $(window).width();
       $('#mask').css({
           'width': maskWidth,
           'height': maskHeight
       });
       $('#mask').fadeIn(0);
       $('#mask').fadeTo("fast", 0.8);
       var winH = $(window).height();
       var winW = $(window).width();
       $(id).css('top', winH / 2 - $(id).height());
       $(id).css('left', winW / 2 - $(id).width() / 2);
       $(id).fadeIn(0);
   }
</script>
<style type="text/css">
   body {
       font-family:verdana;
       font-size:15px;
   }
   a {
       color:#333;
       text-decoration:none
   }
   a:hover {
       color:#ccc;
       text-decoration:none
   }
   #mask {
       position:absolute;
       left:0;
       top:0;
       z-index:9000;
       background-color:#000;
       display:none;
   }
   #boxes .window {
       position:absolute;
       left:0;
       top:0;
       width:0px;
       height:0px;
       display:none;
       z-index:9999;
       padding:20px;
   }
   #boxes #dialog1 {
       position:absolute;
       background-color:#333;
       color: #fff;
       width:675px;
       height:453px;
       padding-top:250px;
   }
</style>
<br />
<br />
<br />
<div id="boxes">
   <br />
   <div id="dialog1" class="window" align="center">
       <br />ATENÇÃO: ESTE SITE É PROIBIDO PARA MENORES DE 18 ANOS.
       <br />Se você não atingiu ainda 18 anos NÃO PROSSIGA!!!
       <br />Os autores e anunciantes deste site não se responsabilizam pelas conseqüências
       da decisão do visitante de ultrapassar este ponto.
       <br />
       <br />Ao clicar em Sou maior de idade, você concorda que é maior de 18 anos.
       <br
       />
       <br />
       <input type="button" value="Sou maior de idade" class="close" />
       <br />
       <form id="formurl" name="formurl" action="http://www.google.com" target="_top">
           <br />
           <input value="Sou menor de idade" onclick="document.getElementById('formurl').submit()"
           type="submit" />
           <br />
           <br />This site contains adult content. DO NOT ENTER if you´re under the age
           of 18, if you live in a country, province or state whose laws prohibit
           the viewing of any such related material.
           <br />
       </form>
   </div>
   <br />
   <div id="mask"></div>
   <br />
</div>

[Roberto Medina 0]

Obrigado LGBT, funciono perfeitamente agora =D

 

me salvou vlw.

 

Resolvido.

[P@trique 0]

:thumbsup: