Hola gente bueno no se si es el apartado mas correcto, para exponer mi consulta,
decir antes de nada que no tengo conocimientos en javascript.
Tengo una pagina con contenido no apto para todo el publico, y me gustaría añadir un mensaje de advertencia en el header de mi template, para que aparezca cuando alguien entre por primera vez.
Eh encontrado este codigo javascript el cual parece funcionar a la perfección.
Código PHP:
<script type="text/javascript">
function getAdultCookie(name) {
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getAdultCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0) break;
}
return null;
}
function setAdultCookie(name, value) {
var argv = setAdultCookie.arguments;
var argc = setAdultCookie.arguments.length;
var expires = (argc > 2) ? argv[2] : null;
var path = (argc > 3) ? argv[3] : null;
var domain = (argc > 4) ? argv[4] : null;
var secure = (argc > 5) ? argv[5] : false;
document.cookie = name + "=" + escape (value) +
((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +
((path == null) ? "" : ("; path=" + path)) +
((domain == null) ? "" : ("; domain=" + domain)) +
((secure == true) ? "; secure" : "");
}
function getAdultCookieVal (offset) {
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}
if (getAdultCookie('CookieAdultAlert') != 'true') {
if ( ! confirm("Advertencia... Este sitio web es para personas mayores de 18 años. \nSi presionan el botón \"OK\" están aceptando:\n\n - Ser mayor de edad y estar consciente del contenido erótico y pornográfico de este sitio web.\n\n - Asegurar no darlo a conocer a menores de edad asÃ* como prevenir que los menores\n vean este sitio web desde su ordenador.\n\n - Este sitio es para uso personal solamente y no implica ningún organismo de estado.")) {
window.location.href = "http://www.canal-onanismo.org";
}
else {
setAdultCookie('CookieAdultAlert', 'true');
}
}
</script>
Pero el resultado final no me termina de gustar, tenia pensado crear una ventana modal al puro estilo (
lightbox, thickbox, greybox, modalbox… son todas ventanas modales) que crean un fondo semi-transparente que cubre la página entera.
El código de la ventana modal de este estilo es este.
Código PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>LIGHTBOX EXAMPLE</title>
<style>
.black_overlay{
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: black;
z-index:1001;
-moz-opacity: 0.8;
opacity:.80;
filter: alpha(opacity=80);
}
.white_content {
display: none;
position: absolute;
top: 25%;
left: 25%;
width: 50%;
height: 50%;
padding: 16px;
border: 16px solid orange;
background-color: white;
z-index:1002;
overflow: auto;
}
</style>
</head>
<body>
<p>This is the main content. To display a lightbox click <a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">here</a></p>
<div id="light" class="white_content">This is the lightbox content. <a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">Close</a></div>
<div id="fade" class="black_overlay"></div>
</body>
</html>
Ahora viene mi problema por el cual pido ayuda, seria posible crear el primer script pero con ventana modal en CSS como el segundo ejemplo?
Espero puedan ayudarme, se lo tendría muy agradecido.
Salu2