JQuery несколько селекторов, исчезать и исчезать

У меня есть функция щелчка

$("#productlink1").click(function() {
    $('#productstitle').fadeOut(1000, function(){
        $('#productstitle').html('<h4>Corporate Promotions </h4>').fadeIn(1000);
        });
    $('#productscontent,#flexibility').fadeOut(1000, function(){
        $('#corporate').fadeIn(1000);
        }); 

    remove();
    $(this).addClass('active');
return false;
});

Поэтому, когда я нажимаю на ссылку, заголовок исчезает, затем новый заголовок, все работает хорошо

Однако второй фрагмент кода, постепенное появление, появляется перед исчезновением, эта строка

$('#productscontent,#flexibility').fadeOut(1000, function(){
            $('#corporate').fadeIn(1000);
            });

Однако, если у меня только один выбранный элемент, он работает нормально

$('#productscontent').fadeOut(1000, function(){
                $('#corporate').fadeIn(1000);
                });

Есть ли проблема с несколькими селекторами?

Спасибо

4 ответа

Решение

http://jsfiddle.net/XgtVw/

 $('#link').click(function() {
  $("#div1, #div2").each(function(){
    $(this).fadeOut(1000, function(){
        $('#div3').fadeIn(1000);
    });
}); 
})

Из jQuery .fadeOut() документация:

Если несколько элементов анимированы, важно отметить, что обратный вызов выполняется один раз для соответствующего элемента, а не один раз для анимации в целом.

Спасибо за все предложения, я не могу заставить работать вышеперечисленное,

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

$("#productlink1").click(function() {
    $('#productstitle').fadeOut(1000, function(){
        $('#productstitle').html('<h4>Corporate Promotions </h4>').fadeIn(1000);
        });
    $('#productscontent,#flexibility').fadeOut(1000, function(){
        $('#corporate').delay(1000).fadeIn(1000);
        }); 

    remove();
    $(this).addClass('active');
return false;
}); 

Это остановило появление, пока другие элементы не исчезли, это не то, как я хотел это исправить, но пока это работает.

С другими ответами происходило то же самое

Элементы, которые уже скрыты, исчезнут

DEMO

Надеюсь, вы спрятали элемент corporate вначале

$(document).ready(function(){
    $("#corporate").hide();     // hiding corporate on document load
    $("#productlink1").click(function() {
        $('#productstitle').fadeOut(1000, function(){
            $('#productstitle').html('<h4>Corporate Promotions </h4>').fadeIn(1000);
            });
        $('#productscontent,#flexibility').fadeOut(1000, function(){
            $('#corporate').fadeIn(1000);
            }); 

        remove();
        $(this).addClass('active');
    return false;
    });
    });
Другие вопросы по тегам