Красивая, анимированная страница с 404й ошибкой

+30
2.41K
И опять продолжение моих экспериментов с jQuery.
На этот раз я добрался до ошибки 404.
Иллюстрация

Ну, начнем.
Для начала, скажу что всё делается для дефолтного шаблона. Если у Вас не дефолтный, то в коде надо будет поменять ссылки.
1.Грузим папку "404" в папку "/templates/_default_/images", скрипт в папку "/templates/_default_/js", а стиль в папку "/templates/_default_/css"
Архив
2. В файле /templates/_default_/special/error404.php, удаляем всё содержимое(не забываем про бэкапы), и вписываем(меняя ссылки на разделы, если надо):
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>Страница не найдена</title>
  5.  
  6. <link rel="stylesheet" type="text/css" href="/templates/_default_/css/404.css" />
  7.  
  8. </head>
  9.  
  10. <body>
  11.  
  12. <div id="rocket"></div>
  13.  
  14. <hgroup>
  15. <h1>Страница не найдена</h1>
  16. <li><a href="/" class="underline">Главная</a></li>
  17. <li><a href="/novosti" class="underline">Новости</a></li>
  18.  
  19. <li><a href="/users/" class="underline">Пользователи</a></li>
  20.  
  21. <li><a href="/blogs/" class="underline">Блоги</a></li>
  22.  
  23. <li><a href="/photos/" class="underline">Фотоальбомы</a></li>
  24.  
  25. </hgroup>
  26. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  27. <script src="/templates/_default_/js/script.js"></script>
  28. </body>
  29. </html>
На этом всё.
Демо-сайт
+1
DeeMon DeeMon 10 лет назад #
Красиво, возьму на заметку.
+1
Patriot Patriot 10 лет назад #
Димон от души! Эксперимент удался на ура! +++
0
Evgenii Evgenii 9 лет назад #
Красиво, пригодится

Еще от автора

Красивое слайд-шоу на главной странице(в модуле "Добро пожаловать")
А я продолжаю свои эксперименты с JQuery, на этот раз добрался до модуля "Добро пожаловать". Он скучный.
Делаем автоматическую смену фона сайта без перезагрузки
Это мой первый пост, так что прошу сильно не пинать. Расскажу я о том, как сделать автоматическую смену фона сайта, БЕЗ перезагрузки страницы.
Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.