Ну что тут скажешь, править мне лень что то. А вот пояснить что к чему могу.
$(document).ready(function() { // Обработчик события "загрузка документа".
$("#contentBody").css("display", "none"); // Установка css свойства "display" в значение "none". Т.е. скрытие элемента с айди "contentBody". инетесно почему не устроил такой вариант: .hide(); (вместо .css("display", "none"))
$("#contentBody").fadeIn(1000); // Плавное отображение только что скрытого элемента
// Обработчик кликов по ссылке с классом "transition"
$("a.transition").click(function(event){
event.preventDefault(); // Тут глушится немедленный переход по ссылке с тем, чтобы запустить его чуть позже
linkLocation = this.href; // Определяем значение атрибута "href" у ссылки по которой кликнули
$("#contentBody").fadeOut(1500, redirectPage); // Плавно скрываем элемент с айди "contentBody" и осуществляем редирект.
});
// Зачем эту функцию сюда засунули? Только отступы лишние и всё. И зачем она вообще? Где логика? Где разум? Каллбячную функцию можно было и не выносить так далеко, особенно когда она состоит всего из одной строки.
function redirectPage() {
// Редирект собственно (вот по этому ваша страница и перезагружается). Кст, переход осуществляется по адресу указанном в атрибуте "href" на кликнутой ссылке
window.location = linkLocation;
}
});
Код написан очень плохо. Зачем создавать свои функции для AJAX когда они есть в jQuery. Или они из jQuery только селекторы с анимацией взяли? На это получается ума хватило а на то чтобы код грамотно оформить - нет. Лучше всё переписать чем править тут что то. Не так уж это и сложно. Поставьте конкретную задачу, начните разбираться в ней и по ходу дела задавайте вопросы. Будем рады помочь.