Скрыть Div и прокрутите, чтобы закрепить с помощью jQuery

Question

У меня есть ссылки, которые показывают / скрывают div на основе клика, и это, кажется, работает нормально. Я пытаюсь заставить его работать так, чтобы при нажатии на ссылку div скрывался, затем показывался скрытый div, и в зависимости от того, какая ссылка нажата, он затем прокручивался до связанной точки привязки. В приведенном ниже примере он хочет перейти к #cf при нажатии на ссылку CF. Как мне добиться этого?

Fiddle:

$('.o-c').click(function() {
 $('.main-home').hide("slide", {
 direction: "right"
 }, 1000);
 $('.section-pages').show("slide", {
 direction: "right"
 }, 1000);

 });

$('.c-f').click(function() {
$('.main-home').hide("slide", {
direction: "right"
}, 1000);
$('.section-pages').show("slide", {
direction: "right"
}, 1000);

});

$('.back').click(function() {
$('.section-pages').hide("slide", {
direction: "right"
}, 1000);
$('.main-home').show("slide", {
direction: "right"
}, 1000);

});

Answer 1

Вы должны добавить обратный вызов на шоу завершено.

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

$('.c-f').click(function () {
    $('.main-home').hide("slide", {direction: "right"}, 1000);
    $('.section-pages').show("slide", {direction: "right"}, 1000, function() {
        $([document.documentElement, document.body]).animate({
            scrollTop: $("#cf").offset().top
        }, 2000);      
      });               
  });