Я хочу показать вам свой способ создания hash-навигации. Он простой и работает если у пользователя поддерживается Javascript.
Основная страница сайта, например, index.php
Я сделаю простой пример, просто с блоком, в который мы будем подгружать другие страницы, ну и с парой ссылок:
Основная страница сайта, например, index.php
Я сделаю простой пример, просто с блоком, в который мы будем подгружать другие страницы, ну и с парой ссылок:
<!DOCTYPE html>
Заголовок страницы
| Главная | Профиль |
all.js
function loader(link) {
$.post("/ajax.php", { section: "page", act: "load", name: link }, function(html){
location.hash = '!/'+link+'';
$("#body").attr("data-page", link);
$('#container').empty();
$("#container").html(html);
} );
}
loader.js
$().ready(function(){
setInterval("checkHash()", 300);
});
function checkHash() {
page = $("#body").attr('data-page');
hash = document.location.hash;
link = hash.replace("#!/", "");
if (hash) {
if (link != page) { loader(link); }
}
else { location.hash = '!/home'; }
}
ajax.php
<?php
$section = $_POST['section'];
$action = $_POST['act'];
if ($section == 'page' && $action == 'load') {
$page_name = $_POST['name'];
if (empty($page_name)) { $page_name = 'home'; }
require_once ('pages/'.$page_name.'.php');
}
?>
ну и, например, pages/home.php
содержание главной страницы
Если возникнут какие-нибудь вопросы, то спрашивайте. Я с удовольствием отвечу.
P.S: Как-нибудь в другой раз расскажу вам как я еще и заголовки страницы меняю в этом же скрипте.
Комментариев нет:
Отправить комментарий