Как сделать окно предупреждения 18+

гром777 · 11.10.2011, 07:45

Добрый день!

Подскажите как сделать Окно предупреждения +18 как на этом сайте для взрослых pornfile_biz

На одном из форумов мне сделали, просто прописали в самой HTML страничке скрипт. Вот посмотрите.

Код HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="EN" lang="EN" dir="ltr">
<head profile="http://gmpg.org/xfn/11">
<title>Internet Business</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="imagetoolbar" content="no" />
<link rel="stylesheet" href="styles/layout.css" type="text/css" />
<script type="text/javascript" src="scripts/jquery-1.4.1.min.js"></script>
<script type="text/javascript" src="scripts/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="scripts/jquery.hoverIntent.js"></script>
<script type="text/javascript" src="scripts/jquery.hslides.1.0.js"></script>
<script type="text/javascript" src="scripts/jquery.hslides.setup.js"></script>
<script type="text/javascript">
function setCookie (name, value, expires, path, domain, secure) {
      document.cookie = name + "=" + escape(value) +
        ((expires) ? "; expires=" + expires : "") +
        ((path) ? "; path=" + path : "") +
        ((domain) ? "; domain=" + domain : "") +
        ((secure) ? "; secure" : "");
}

function getCookie(name) {
	var cookie = " " + document.cookie;
	var search = " " + name + "=";
	var setStr = null;
	var offset = 0;
	var end = 0;
	if (cookie.length > 0) {
		offset = cookie.indexOf(search);
		if (offset != -1) {
			offset += search.length;
			end = cookie.indexOf(";", offset)
			if (end == -1) {
				end = cookie.length;
			}
			setStr = unescape(cookie.substring(offset, end));
		}
	}
	return(setStr);
}

function is18Confirmed(){
if (!getCookie('18_confirm'))
{
        var exp  = new Date();
        exp.setTime((new Date()).getTime()+100000000000);
        expires = exp.toGMTString();
        var div = document.createElement('div');
        div.innerHTML = 
                         "<div style='position:fixed; z-index: 100;width:100%; height: 100%; top: 0px; left:0px;' id='18_popup_div'>"
                        +"      <div style='position:relative; width:100%; height:100%'>"
                        +"              <div style='position:absolute; top:0px; left:0px;background-color:gray; filter:alpha(opacity=70); -moz-opacity: 0.7; opacity: 0.7;  z-index:200;width:100%; height:100%'></div>"
                        +"              <div style='position:absolute; top:0px;margin:auto; z-index:300;  width: 100%; height:500px; '>"
                        +"                      <div style='margin:auto; width:400px;background-color: white; border: solid 1px black; padding: 40px;margin-top:100px'>"
                        +"                              Внимание! <br />Вы собираетесь зайти на сайт с материалами для взрослых.<br /> Лицам младше 18 лет вход строго запрещен.<br />Нажимая кнопку \"Продолжить\", Вы подтверждаете, что Вам более 18 лет и Вы согласны просматривать материалы, предназначенные только для взрослых.<br />Если Вам менее 18 лет - пожалуйста, закройте вкладку браузера, чтобы покинуть сайт."
                        +"                              <br/><br/><a href='#' style='display:block; width: 100px; text-align: center; text-decoration:none; font-size:14px; font-weight:bold; color:white; background-color: green; padding: 8px; margin: 0px 0px;' onclick='setCookie(\"18_confirm\", 1, expires, \"/\");document.getElementById(\"18_popup_div\").style.display=\"none\";return false;'>Продолжить</a>"
                        +"                      </div>"
                        +"              </div>"
                        +"      </div>"
                        +"</div>";
        var wrap = document.getElementById('header');
        wrap.parentNode.insertBefore(div, wrap);
}
}
</script>
</head>
<body id="top" onLoad="is18Confirmed();">
<div id="header">
  <div class="wrapper">
    <div class="fl_left">
      <h1><a href="#">Internet Business</a></h1>
      <p>Free CSS Website Template</p>
    </div>
    <div class="fl_right"> <a href="#"><img src="images/demo/468x60.gif" alt="" /></a> </div>
    <br class="clear" />
  </div>
</div>
<!-- ####################################################################################################### -->
<div id="topbar">
  <div class="wrapper">
    <div id="topnav">
      <ul>
        <li class="active"><a href="index.html">Home</a></li>
        <li><a href="style-demo.html">Style Demo</a></li>
        <li><a href="full-width.html">Full Width</a></li>
        <li><a href="#">DropDown</a>
          <ul>
            <li><a href="#">Link 1</a></li>
            <li><a href="#">Link 2</a></li>
            <li><a href="#">Link 3</a></li>
          </ul>
        </li>
        <li class="last"><a href="#">A Long Link Text</a></li>
      </ul>
    </div>
    <div id="search">
      <form action="#" method="post">
        <fieldset>
          <legend>Site Search</legend>
          <input type="text" value="Search Our Website&hellip;"  onfocus="this.value=(this.value=='Search Our Website&hellip;')? '' : this.value ;" />
          <input type="submit" name="go" id="go" value="Search" />
        </fieldset>
      </form>
    </div>
    <br class="clear" />
  </div>
</div>
<!-- ####################################################################################################### -->
<div id="featured_slide">
  <div class="wrapper">
    <div class="featured_content">
      <ul id="accordion">
        <li class="current">
          <div class="featured_box">
            <h2>1. Aliquatjusto quisque nam</h2>
            <p>Orcimagna rhoncus et a nec antesque sed temportor pellus nibh conseque. Accumstsemper wisi pretium feugiat non ut eleifendrerisque at et condisse sce. Iaculumorci congue nam mollis odio id cras orci vestique euisquet at. Donecconsectetus lacilis ac pellus nam nibh curabitur sed anterdum nectetus adipis. Pretiummagnisse antes nunc pretium convallis tincidunt non at rutrumt.</p>
            <p class="readmore"><a href="#">Continue Reading &raquo;</a></p>
          </div>
          <div class="featured_tab"> <img src="images/demo/100x100.gif" alt="" />
            <p>Tabbed Navigation 1</p>
          </div>
        </li>
        <li>
          <div class="featured_box">
            <h2>2. Aliquatjusto quisque nam</h2>
            <p>Duisvest lacus pellus purus temper maurisus et sodalesuada loreet sapiente et. Quissociis magnisl orci dui nulla ut antesque malesuada sed pede et. Idlacus ridiculisi nec cursus enim ac tur urnar nunc pellus pellenterdum. Necelisi aliquat curabiturpiscing semportortor sed et velit convallis quat adipiscing cursus. Rutrumeget id ipsum et sed maurisuspendimentum auctor siti.</p>
            <p class="readmore"><a href="#">Continue Reading &raquo;</a></p>
          </div>
          <div class="featured_tab"><img src="images/demo/100x100.gif" alt="" />
            <p>Tabbed Navigation 2</p>
          </div>
        </li>
        <li>
          <div class="featured_box">
            <h2>3. Dapiensociis temper</h2>
            <p>Pharetiumurna habitur et enim pellentesque phasellus aliquam nunc quis justo nam. Lobortororci dapibulum ac intesquet ut id sed intesque nec alique congue. Liberoaenec vest maurisus libero pede nisl ligula cursus vitae dis metus. Aeneanaccumsan orci nasce ac pulvinare enim tor quis antesque cumsan in. Justomontesque sem ac dolor iaculum dolor orci elit lacus et vestibulum.</p>
            <p class="readmore"><a href="#">Continue Reading &raquo;</a></p>
          </div>
          <div class="featured_tab"><img src="images/demo/100x100.gif" alt="" />
            <p>Tabbed Navigation 3</p>
          </div>
        </li>
        <li>
          <div class="featured_box">
            <h2>4. Nullain convallis ris elis</h2>
            <p>Nullamcorpervivamus nisl in sed adipit donec feugiat lor vel velit volutpat. Wisihabitur diculisi ac curabitur cursuspendreris sociis sed eger ipsum condisse laculis. Curabiturid non eu curabitae nibh por nullamcorper at nibh elis fring. Vestnibh congue praesenenatis justo et maecenasceleifend senterdum malesuada at dolor amet. Turisristibulum curabitae eros leo at interd.</p>
            <p class="readmore"><a href="#">Continue Reading &raquo;</a></p>
          </div>
          <div class="featured_tab"><img src="images/demo/100x100.gif" alt="" />
            <p>Tabbed Navigation4</p>
          </div>
        </li>
        <li>
          <div class="featured_box">
            <h2>5. Nullain convallis ris elis</h2>
            <p>Nullamcorpervivamus nisl in sed adipit donec feugiat lor vel velit volutpat. Wisihabitur diculisi ac curabitur cursuspendreris sociis sed eger ipsum condisse laculis. Curabiturid non eu curabitae nibh por nullamcorper at nibh elis fring. Vestnibh congue praesenenatis justo et maecenasceleifend senterdum malesuada at dolor amet. Turisristibulum curabitae eros leo at interd.</p>
            <p class="readmore"><a href="#">Continue Reading &raquo;</a></p>
          </div>
          <div class="featured_tab"><img src="images/demo/100x100.gif" alt="" />
            <p>Tabbed Navigation 5</p>
          </div>
        </li>
      </ul>
    </div>
  </div>
</div>
<!-- ####################################################################################################### -->
<div id="homecontent">
  <div class="wrapper">
    <ul>
      <li>
        <h2 class="title"><img src="images/demo/60x60.gif" alt="" />Nullamlacus dui ipsum conseque loborttis</h2>
        <p>Nullamlacus dui ipsum conseque loborttis non euisque morbi penas dapibulum orna. Urnaultrices quis curabitur phasellentesque congue magnis vestibulum quismodo nulla et feugiat. Adipisciniapellentum leo ut consequam ris felit elit id nibh sociis malesuada.</p>
        <p class="readmore"><a href="#">Continue Reading &raquo;</a></p>
      </li>
      <li>
        <h2 class="title"><img src="images/demo/60x60.gif" alt="" />Nullamlacus dui ipsum conseque loborttis</h2>
        <p>Nullamlacus dui ipsum conseque loborttis non euisque morbi penas dapibulum orna. Urnaultrices quis curabitur phasellentesque congue magnis vestibulum quismodo nulla et feugiat. Adipisciniapellentum leo ut consequam ris felit elit id nibh sociis malesuada.</p>
        <p class="readmore"><a href="#">Continue Reading &raquo;</a></p>
      </li>
      <li class="last">
        <h2 class="title"><img src="images/demo/60x60.gif" alt="" />Nullamlacus dui ipsum conseque loborttis</h2>
        <p>Nullamlacus dui ipsum conseque loborttis non euisque morbi penas dapibulum orna. Urnaultrices quis curabitur phasellentesque congue magnis vestibulum quismodo nulla et feugiat. Adipisciniapellentum leo ut consequam ris felit elit id nibh sociis malesuada.</p>
        <p class="readmore"><a href="#">Continue Reading &raquo;</a></p>
      </li>
    </ul>
    <br class="clear" />
  </div>
</div>
<!-- ####################################################################################################### -->
<div id="container">
  <div class="wrapper">
    <div id="content">
      <h2>About This Free CSS Template</h2>
      <p>This is a W3C standards compliant free website template from <a href="http://www.os-templates.com/">OS Templates</a>.</p>
      <p>This template is distributed using a <a href="http://www.os-templates.com/template-terms">Website Template Licence</a>, which allows you to use and modify the template for both personal and commercial use when you keep the provided credit links in the footer.</p>
      <p>For more CSS templates visit <a href="http://www.os-templates.com/">Free Website Templates</a>.</p>
      <p>Lacusenim inte trices lorem anterdum nam sente vivamus quis fauctor mauris. Wisinon vivamus wisis adipis laorem lobortis curabiturpiscingilla dui platea ipsum lacingilla.</p>
      <p>Semalique tor sempus vestibulum libero nibh pretium eget eu elit montes. Sedsemporttis sit intesque felit quis elis et cursuspenatibulum tincidunt non curabitae.</p>
    </div>
    <div id="column">
      <div class="holder">
        <h2>Nullamlacus loborttis</h2>
        <ul id="latestnews">
          <li> <img class="imgl" src="images/demo/100x75.gif" alt="" />
            <p><strong><a href="#">Indonectetus facilis leo.</a></strong></p>
            <p>Nullamlacus dui ipsum cons eque loborttis non euis que morbi penas dapibulum orna. Urnaultrices quis curabitur phasellentesque.</p>
          </li>
          <li class="last"> <img class="imgl" src="images/demo/100x75.gif" alt="" />
            <p><strong><a href="#">Indonectetus facilis leo.</a></strong></p>
            <p>Nullamlacus dui ipsum cons eque loborttis non euis que morbi penas dapibulum orna. Urnaultrices quis curabitur phasellentesque.</p>
          </li>
        </ul>
      </div>
    </div>
    <br class="clear" />
  </div>
</div>
<!-- ####################################################################################################### -->
<div id="footer">
  <div class="wrapper">
    <div id="newsletter">
      <h2>Stay In The Know !</h2>
      <p>Please enter your email to join our mailing list</p>
      <form action="#" method="post">
        <fieldset>
          <legend>News Letter</legend>
          <input type="text" value="Enter Email Here&hellip;"  onfocus="this.value=(this.value=='Enter Email Here&hellip;')? '' : this.value ;" />
          <input type="submit" name="news_go" id="news_go" value="GO" />
        </fieldset>
      </form>
      <p>To unsubscribe please <a href="#">click here &raquo;</a></p>
    </div>
    <div class="footbox">
      <h2>Lacus interdum</h2>
      <ul>
        <li><a href="#">Praesent et eros</a></li>
        <li><a href="#">Praesent et eros</a></li>
        <li><a href="#">Lorem ipsum dolor</a></li>
        <li><a href="#">Suspendisse in neque</a></li>
        <li class="last"><a href="#">Praesent et eros</a></li>
      </ul>
    </div>
    <div class="footbox">
      <h2>Lacus interdum</h2>
      <ul>
        <li><a href="#">Praesent et eros</a></li>
        <li><a href="#">Praesent et eros</a></li>
        <li><a href="#">Lorem ipsum dolor</a></li>
        <li><a href="#">Suspendisse in neque</a></li>
        <li class="last"><a href="#">Praesent et eros</a></li>
      </ul>
    </div>
    <div class="footbox">
      <h2>Lacus interdum</h2>
      <ul>
        <li><a href="#">Praesent et eros</a></li>
        <li><a href="#">Praesent et eros</a></li>
        <li><a href="#">Lorem ipsum dolor</a></li>
        <li><a href="#">Suspendisse in neque</a></li>
        <li class="last"><a href="#">Praesent et eros</a></li>
      </ul>
    </div>
    <br class="clear" />
  </div>
</div>
<!-- ####################################################################################################### -->
<div id="copyright">
  <div class="wrapper">
    <p class="fl_left">Copyright &copy; 2011 - All Rights Reserved - <a href="#">Domain Name</a></p>
    <p class="fl_right">Template by <a href="http://www.os-templates.com/" title="Free Website Templates">OS Templates</a></p>
    <br class="clear" />
  </div>
</div>
</body>
</html>

Да скрипт работает и выводит окно.
Но каждый раз выводит, перезагружаешь страницу и окно предупреждения +18 опять видно.

Этого не должно быть, окно должно появится только один раз правильно, чтоб предупредить, а не каждый раз гуляя по сайту. Вот сами посмотрите на сайте pornfile_biz если нажать продолжить, то окно больше не появится, пока не очистить кеш браузера.

Кто разбирается и знает как установить точно такой же скрипт как на сайте для взрослых, большая просьба помогите! Покажите на примере, установите в шаблон скрипт, я не знаю нужно использовать папки scripts, styles чтоб заработал скрипт.

Я много писал на разных форумах, но до конца разобраться не получается. Я прикрепил обычный css шаблон сайта, чистый код в нем папки с images, scripts, styles и html-страничками. Я там не чего не прописывал. Скрипт с окном предупреждения находится на сайте pornfile_biz

Заранее благодарен!
С Уважением Алексей!

redreem · 11.10.2011, 10:03

скрипт сохраняет данные о подтверждении 18 лет в куках. если они у вас отключены, то, естественно, он будет срабатывать каждый раз при перезагрузке страницы. включите куки. скрипт работает.

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Как в Dreamweaver сделать всплывающее окно?	Veha	Софтодром	22	03.05.2010 15:58
как сделать надпись ЗАКРЫТЬ ОКНО	baho	HTML, CSS, JavaScript	12	31.12.2005 22:30
окно	dimka_sh	HTML, CSS, JavaScript	8	09.11.2005 22:32
Как создать pop-up окно?	Cowboy Marlboro	HTML, CSS, JavaScript	6	24.05.2005 15:42
Окно	BULLDOG	ASP, Perl, PHP и MySQL	1	15.03.2003 19:02

11.10.2011, 10:03	#2
redreem	скрипт сохраняет данные о подтверждении 18 лет в куках. если они у вас отключены, то, естественно, он будет срабатывать каждый раз при перезагрузке страницы. включите куки. скрипт работает.

11.10.2011, 07:45
Ссылки