Много кто мечтает на uCoz об адекватной AJAX навигации. К сожалению, полноценно её организовать не получится, но все же возможность есть. Если кто не знает, что такое AJAX, то вкратце: AJAX служит для загрузки контента без обновления страницы (Живой пример - сайт VK)
С установкой все же придется немного повозиться. Так как нужно настраивать каждую ссылку для AJAX навигации по отдельности. Теперь начнем по пунктам.
Установка:
1. Код вставить перед </body> (Можно в Глобальный блок: Нижняя часть сайта):
Код
<p><script>
$(function($){
$('.ajax').attr('onclick','return false;').click(function(){
var title = $(this).attr('title');
var href = $(this).attr('href');
/*[!!!!! Можно вставить какой либо ПРЕЛОАДЕР (Здесь его иницализировать)]*/
$('title').html(title);
$('#content').load(href+' #content', function(){
history.pushState(null, null, href);
/*[!!!!! Можно вставить какой либо ПРЕЛОАДЕР (Здесь его удалять)]*/
});
});
});
window.onpopstate = function( e ) {
var returnLocation = history.location || document.location;
var returnTitle = history.propertyName || document.title;
/*[!!!!! Можно вставить какой либо ПРЕЛОАДЕР (Здесь его иницализировать)]*/
$('title').html(returnLocation.title)
$('#content').load(returnLocation.href+ ' #content', function(){
history.pushState(null, null, href);
/*[!!!!! Можно вставить какой либо ПРЕЛОАДЕР (Здесь его удалять)]*/
});
}
</script></p>
* Восклицательными знаками специально пометил места, где можно вставить прелоадер. (Например: https://proucoz.site/scripts/preloader-for-site)
2. Контент, который будет динамически меняться при переходе, нужно вставить в блок:
Код
<div id="content">ваш код</div>
3. К ссылкам для AJAX переходов нужно добавить класс ajax:
Код
<a href="ссылка на страницу" title="название для смены title" class="ajax">Ссылка</a>
id="content" был обязательно на двух страницах! На которой человек кликает на ссылку, и на которую ведет ссылка!
