Ajax加载：调用回调但内容未加载到div中

Question

我在外部javascript文件中定义了以下两个函数：

function show_sidebar_left(url, sb_width, sb_time){
    $('#sidebar_left').css({'left':-sb_width, 'width': sb_width}); 
    $('#sidebar_left').animate({"left":"0px"}, sb_time, function(){
        $('#sidebar_left').load(url, function(){
            alert("test");
        });
        $('#sidebar_left').addClass('sidebar_left_open');
    });
    $('#overlay').fadeIn(200);
}

function hide_sidebar_left(speed){

    var sidebar_left_pos = parseInt($('#sidebar_left').css('width'),10) + 20;
    $('#sidebar_left').html('');
    if($('#sidebar_left').hasClass('sidebar_left_open')){
        $('#sidebar_left').animate({"left":'-' + sidebar_left_pos + 'px'}, speed, function(){
            $('#sidebar_left').removeClass();
        });
        $('#overlay').fadeOut(200);                
    }

}

这是一个滑动div，我想填充外部php文件的内容（只包含一些html标签）。 我用以下文件调用该文件：

    $('#bars_tb_search').click(function(){
        show_sidebar_left('http://www.zwoop.be/develop/home/bars/bars_toolbox/toolbox_search.php', 550, 300); 
        });

div按预期正确滑动，以便工作 正确调用Ajax加载的回调函数中的“alert” 但是......我的div没有加载（我在Google Chrome中的元素检查器中检查过）。

控制台未指出有关此负载的Javascript错误 任何想法我的问题可能是什么或我可能做错了什么？

修改 在图片中，它显示了应用的CSS样式。

当我调整页面大小时，现在会发生这种情况：

这对你有意义吗？我失去了信心：-s

EDIT2

加载的页面不包含额外的css，它是一个带有静态html的php页面：

<p style="text-align: center">
    <i>
        Note that these filters are applied on top of the results, already filtered by the search categories and tags.
    </i>
</p>
<p style="text-align: center">
    <i>
        To filter on <b>all</b> bars, you can remove the previous filters here: 
    </i>
</p>