Хаки и Скрипты Next Generation CMS

Прелоадер с затемнением фона

irbees2008 irbees2008 Опубликовано - 17 - мая Интерфейс
6025 - 0
  • Адаптировал: irbees2008
  • Уровень сложности исполнения: это делается простым копированием и нажиманием кнопки

Сегодня я опишу как поставить на Ваш сайт прелоадер с затемнением фона и текстом в центре при переходе между страницами.
И так приступим
1. В конец main.tpl, перед закрывающим тегом body добавьте:

Код:
<div class="someclass">
<div class="loading">
Идёт загрузка, ждите...
</div>
</div>
<script>
jQuery(function($) {
$(window).load(function () {
$(".someclass").fadeOut(500);
});
});
</script>
2. В файл стилей шаблона добавьте:
Код:
.someclass {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.8);
z-index: 5000;
}
.someclass .loading {
position: absolute;
top: 50%;
left: 50%;
margin: -40px 0 0 -150px;
width: 260px;
height: 20px;
padding: 20px;
background: rgba(0, 0, 0, 0.6);
color: #fff;
font: normal 16px/20px Verdana, Geneva, Arial, Helvetica, sans-serif;
text-shadow: 0 1px 2px #000;
text-align: center;
z-index: 5001;
border: solid 2px #000;
border-radius: 10px;
box-shadow: 0 0 10px 2px rgba(255, 255, 255, 0.2);
}

Очистите кеш браузера.Все готово.

Можешь почитать и вот эту статейку "Советы как бесплатно раскрутить свой сайт"

Опрос

Ваше мнение

Каким софтом вы пользуетесь?
Результаты

Последние комментарии

Теги

Anything in here will be replaced on browsers that support the canvas element

Статистика

  • Caйту: 4488 дней
  • Новостей: 566
  • Комменты: 257
  • Зарегистрированно : 670
  • Онлайн всего: [8]
  • Гости: [7]
  • Поисковики: [1] Яндекс
  • Были сегодня : [3] Google, Яндекс, dankeanke
  • SQL запросов: 29
  • Генерация страницы: 0.271сек
  • Потребление памяти: 5.152 Mb 
  •   Яндекс.Метрика