将内容顺利添加到div

Question

我的网站从菜单中选择后会加载“子页面”，并将其附加到一个空的隐藏div。

它正在工作，但是我对它的感觉不满意。交换div内容时，网站出现断断续续/闪烁的情况。

所以，我正在做的事情是这样的：

HTML

<div class="button" id="page1">Button for link</div>
<div class="subContent">
    <div class="containerContentBox textLeft">                  
        <div id="placeContent"><!-- Content goes here --></div>                 
    </div>
</div>

在Javascript中，我试图通过使主div变淡，更改内容然后将其淡入淡出来平滑过渡，如下所示：

JS

var chosenPage = "";

// Click button
$('.button').click(function(){              
    chosenPage = $(this).attr('id');    
    $('#placeContent').fadeOut('fast', function(){
        $('#placeContent').empty();
        showSelectedPage();
    });    
});

// Apply the page
function showSelectedPage(){        
    var newPageFile = "/pages/" + chosenPage + ".html";     
    $.get(newPageFile)
        .done(function(data) {          
            $('#placeContent').html(data);              
            $('#placeContent').fadeIn('fast', function(){
                scrollToContent();
            });
        }).fail(function() { 
            console.log('Page not found');
            return;
        });

}

// Scroll to top of the appended page   
function scrollToContent(){
    $('html,body').animate({
        scrollTop: $(".subContent").offset().top - 40
    }, 'slow');
}

有更好的方法吗？我认为闪烁/停顿来自滚动条的高度变化。