jQuery-slideDown slideUp-fadeIn fadeOut-ScrollTo

我想试着达到这个效果

所以我有一个网站100%的高度。在页脚我有两个按钮，联系人和信息。单击其中一个按钮时，页面应首先向下滚动，然后在相应内容中淡入。单击另一个按钮时，我希望淡出内容，淡入新内容，而不滚动

然后我想在淡入的内容中有一个关闭按钮，一旦单击它，内容就会淡出，然后向上滚动

我希望这是有道理的

这里有一个例子，我的意思是点击其中一个设计师或加入我们的邮件列表

这是我可怜的尝试

}

我希望能有人帮我解决这个问题

    function toggleSlider() {
if (jQuery("#panelThatSlides").is(":visible")) {
     jQuery('html, body').animate({
    scrollTop: 300
}, 600),
    jQuery("#contentThatFades").animate(
        {
            opacity: "0"
        },
        600,
        function(){
            jQuery("#panelThatSlides").slideUp();
        }
    );
}
else {
  jQuery('html, body').animate({
    scrollTop: 300
}, 600),
    jQuery("#panelThatSlides").slideDown(600, function(){

        jQuery("#contentThatFades").animate(
            {
                opacity: "1"
            },
            600
        );
    });
}