jquery html () не работает с позиционированным элементом в Chrome

Question

У меня есть диалоговое окно с параграфом, к которому я пытаюсь добавить контент через ajax. Элемент позиционируется так:

<div id="modal" style="height:100%; width:100%; position:fixed; z-index:1; left:0; top:0; display:none;">

 <div style="position:fixed; top:50%; left:0; width:100%;">
     <div style="height:150px; width:300px; margin:auto;">
         <div>Processing</div>
            <div>
            <p id="dialog">Please Wait...</p>
            </div>
        </div>
    </div>

</div>

Обратите внимание, я звоню:

$('#modal').show("fast");

перед попыткой добавить к нему контент.

Затем я пытаюсь добавить в диалог абзац так:

$.post(
  'processor.php', 
  queryString, 
  function(data){
   alert('data:'+data);
   $('#dialog').html(data);
  }
 )

Он не вставляет HTML в абзац диалога. Я попытался добавить контент в другой элемент, который не позиционируется, и он работал нормально.

Кто-нибудь знает, почему это не работает? или есть исправление?

P.s. Я знаю, что я должен переместить мои стили в таблицу стилей, обычно я делаю это в конце.

Обновление

Я хотел, чтобы вы знали, что у меня только 1 идентификатор диалога, и он фактически удаляет текст внутри #dialog, просто ничего не добавляя.

Также я называю это в document.ready

Вы можете увидеть страницу здесь нажмите кнопку отправки в самом низу, чтобы увидеть, как это происходит.

Update2

Это работает правильно в FF и IE, но только в Chrome.

Answer 1

если вы просматриваете журнал консоли, текст там. попробуйте добавить css в диалог что-то вроде:

#dialog { display:block; width:auto; height:auto;}

Answer 2

Скрытие, изменение текста и его повторное показание, кажется, заставляют его работать.Вы должны анимировать как шкуру, так и шоу, чтобы заставить его работать, хотя:

$('#mydialog').hide("slow",function(){
                $('#mydialog').html(data);
                $('#mydialog').show("slow");
            });

Это выглядит не очень элегантно.Я бы предпочел лучшее исправление, если у кого-то есть такое.

edit:

Лучше всего выглядела работа, которую я придумал, используя 2 диалоговых окна и переключая их при изменении текста.

Answer 3

 $(document).ready(function() {
   // do stuff when DOM is ready

   //Is your code called inside here or after this function is executed? 
   //If not, it should be.
 });