затухание, загрузка нового контента, затухание -> слайд

Question

В настоящее время я выгружаю содержимое div, заменяю его новым, а затем снова добавляю, как показано ниже:

area.fadeOut('400').load("file.php", 
    function(){
        $(this).fadeIn('400');
    }
);

Прежде всего, правильно ли это связано?

Во-вторых, я хотел бы заменить постепенное добавление смещением справа, если это было возможно (нужно было бы сдвинуть старый контент влево)? Как этого достичь?

Answer 1

Я хотел бы отметить, что fadeIn & fadeOut являются частью jQuery Core. У вас загружен пользовательский интерфейс jQuery? Если нет, он понадобится вам для версии шоу, используемой в других ответах.

Кроме того, у вас уже есть переменная области, поэтому нет необходимости повторно создавать экземпляр с S(this). Это замедляет опыт, чем больше вы это делаете.

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

var newArea = area.clone().css("display", "none").insertAfter(area);
newArea.load("file.php", function() {
    area.hide("slide", {direction:"left"}, 400, function() {
        area.remove();
        area = newArea;
    });
    newArea.show("slide", {direction:"left"}, 400);

});

Он должен загрузиться в скрытый элемент, а затем скользить с правой стороны, как исходный элемент смещается влево.

РЕДАКТИРОВАТЬ: Поскольку кажется, что вы ищете что-то немного другое, я обновляю код.

Answer 2

area.fadeOut('400', function() {
    $(this).load("file.php", function() {
            $(this).show("slide", {direction:"left"}, 400);
    });
});

Я думаю, вам нужно позвонить load, как это, потому что может не дождаться завершения fadeOut.

Answer 3

выглядит нормально для меня, просто замените вызов на fadeIn() на $(this).show("slide", { direction: "left" }, 400);