Как сделать заставку на сайт | CSS и JavaScript

• Всплывающее окно при входе на сайт
• Автосохранение заполненных полей на JavaScript
• Как остановить загрузку страницы JavaScript
• зафиксировать панель

Добрый день, Наталья. Прошу прощения за то, что пишу в личку по глупым вопросам. И сразу хочу сказать, что довольно восхищен тем, что вы делаете.

Вопрос: как сделать так, чтобы когда человек набирал адрес блога, то сначала переходил не на главную страницу, а на какую-нибудь другую.. Или еще лучше: у него открывалось бы изображение на весь экран и при клике бы совершался переход на главную... Что-то наподобие всплывающего окна..

То есть задачу можно сформулировать так: при первом посещении сайта посетителю показывается "заставка", а при дальнейшем перемещении по внутренним ссылкам — главная страница.

Собственно говоря, есть два варианта:

1. sessionStorage — заставка нужна при каждом новом открытии вкладки (не страницы),
2. localStorage — заставка нужна для одного человека только один раз за всю его историю посещения сайта.

<style>
#pop-up {
  position: fixed; top: 0; bottom: 0; left: 0; right: 0;
  z-index: 100;
  background: rgba(0,0,0,.5) url(http://www.afsklyar.ru/zaglu1.jpg) no-repeat 50% 50%;
  background-size: cover;
}

#pop-up div {
  position: absolute;
  right: 10%;
  top: 20%;
  padding: 3%;
  border-radius: 3%;
  font-size: 300%;
  white-space: pre-wrap;
  line-height: 100%;
  color: #fff;
  background: red;
  cursor: pointer;
}
</style>

<div id="pop-up">
  <div onclick="popUp()">посмотреть
реализацию</div>
</div>

<script>
var popup = document.getElementById('pop-up');

function popUp() {
  sessionStorage.setItem('popup', 'none');
  location.reload();
}

if(sessionStorage.getItem('popup') || !window.sessionStorage) {
  popup.parentNode.removeChild(popup);
}else{
  if(window.stop !== undefined) {
    window.stop();
  } else if (document.execCommand !== undefined) {
    document.execCommand("Stop", false);
  }
}
</script>

Это самый упрощённый вариант. Количество элементов в заставке (например, наличие социальных кнопок) каждый определяет сам.

Скрипт хорош тем, что не нарушает правил Google AdSense, заставка не перекрывает рекламные объявления, так как те не загружаются. Но код JavaScript нужно расположить выше кода AdSense.

посмотреть реализацию

Куда добавить код заставки в Blogger?

Я бы добавила код в гаджет HTML/JavaScript. А показ самого гаджета ограничила бы условием (см. как это сделать):

<b:if cond='data:blog.url == data:blog.homepageUrl'>