изменение размера div после вызова AJAX jQuery

Question

Я пытаюсь изменить размер div после загрузки в новый HTML-контент через AJAX. У меня есть система привязки hashbang, которая загружает определенные фрагменты HTML, если в URL есть определенные хэши. Высота div изменяется правильно, когда ссылки нажимаются для загрузки содержимого, но вычисленная высота загруженного содержимого на 20 пикселей меньше, когда страница перемещается напрямую.

HTML:

<div id="help_page_header"> 
     <h3>Need some help with searches?</h3> 
     <ul class="help_tabs"> 
     <li class="help_tab"><a class="docs_link" rel="recommendations" href="#!/recommendations">Recommendations</a></li> 
     <li class="help_tab"><a class="docs_link" rel="whats_hot" href="#!/whats_hot">What's Hot</a></li> 
     <li class="help_tab"><a class="docs_link" rel="history" href="#!/history">History</a></li> 
     <li class="help_tab"><a class="docs_link" rel="misc" href="#!/misc">Additional Features</a></li> 
     </ul> 
     </div> 
     <div class="help_page_content"> 
     <p>Select a help topic above!</p> 
     </div> 
... 

JQuery:

$(document).ready(function(){ 
    if(window.location.hash) 
    { 
    loadContent(window.location.hash) 
    } 

    $(".docs_link").click(function(e){ 
    $(".help_page_content").html("") 
    var fragment = this.hash 
    loadContent(fragment) 
    }); 

    function loadContent(fragment) 
    { 
    fragment = fragment.slice(1).replace(/!\//g, ""); 
    $(".help_page_content").load("./"+fragment+".html", function(){ 
     var height = $("#ajax_page_wrap").outerHeight(); 
     $(".help_page_content").animate({height: height}, 500); 
    }); 
    } 
}); 

Пример для уточнения:

Если я перейти непосредственно www.homepage.com/docs/, а затем выберите один из ссылки справки для загрузки контента, высота вычисляется штрафом. Однако, если я перехожу на www.homepage.com/docs/#!/history, вычисленная высота всегда примерно на 20 пикселей меньше, чем должно быть.

Answer 1

Есть ли изображение внутри div #ajax_page_wrap, которое еще не загружено, когда вы перемещаетесь прямо туда (и вызов AJAX завершается до его загрузки)?

А как насчет использования $(window).load (который ждет все изображения для загрузки) вместо $(document).ready (а это не так). См. this answer.

Надеюсь, что это поможет! Лемме знаю, если это не проблема, и я продолжу мозговой штурм :)