Нужна помощь с JQuery AJAX и эффектами перехода

Question

Хорошо, ребята, мой сайт почти закончен - http://www.visualise.ca/

Но есть одна вещь, которая действительно меня беспокоит.Когда я нажимаю на миниатюру, чтобы открыть публикацию, которая загружается на той же странице, используя AJAX, а затем нажимаю на другую миниатюру, чтобы загрузить другую публикацию, переход происходит не плавно, а загрузка изображения занимает некоторое время, и это уродливо.Есть ли способ, которым я могу улучшить это и сделать все гладко, используя fadeIn / fadeOut?

Вот что я попробовал без удачи (сейчас активен).

$(".ajaxed").live("click", function(event) {
        $.address.crawlable(true).value($(this).attr("rel"));
        $("#content").fadeTo(500,0);
        $("html,body").animate({scrollTop: 205}, 300);
        var post_slug = $(this).attr("rel");
        $("#board").load("ajax/",{slug:post_slug});
        $("#board").delay(1500).slideDown("slow");
        return false;
});

Большое спасибо за ваше времяи помощь

Answer 1

Вот код, который я в итоге использую.

$(".navig a").live("click", function(event) {
    var post_slug = $(this)[0].pathname.substring(1);
    var board_h = $("#board").height();
    $.address.crawlable(true).value(post_slug).strict(true);
    $("#board-wrapper").css('height', board_h + 'px');
    $("#board").fadeOut('slow', function(){
        $("#board").stop().load("ajax/",{slug:post_slug}, function(){
            $("#board").delay(1000).fadeIn('slow', function(){
                var board_h2 = $("#board").height();
                $("#board-wrapper").css('height', board_h2 + 'px');
            });

        });
    });
    return false;
});

Просто чтобы люди знали.

Answer 2

Попробуйте это

$(".ajaxed").live("click", function(event) {
        var post_slug = $(this).attr("rel");
        $.address.crawlable(true).value(post_slug );
        $("#content").fadeTo(500,0);
        $("html,body").animate({scrollTop: 205}, 300);
        $("#board").stop().load("ajax/",{slug:post_slug}, function(){
            $(this).slideDown("slow")
        });

        return false;
});