Диалог пользовательского интерфейса jQuery запутался

Question

У меня есть несколько диалоговых окон на веб-сайте, который я создал для клиента. Когда два диалоговых окна открыты одновременно, вещи в итоге портятся . Диалог, кажется, выглядит хорошо в первый раз, когда он появляется. Но затем, когда пользователь закрывает диалоговое окно (вверху) и открывает его снова, оно портится. (проверьте изображения)

В основном я делаю следующее:

$(document).ready(function() {
   $("#someDiv").dialog({
      //options
   });

   $("#someButton").click(function() {
      $("#someDiv").dialog('open');
   });

   $("#closeButton").click(function() {
      $("#someDiv").dialog('close');
   });
});

Это в основном поток того, как я открываю и закрываю диалоги. Я что-то не так делаю?

Когда пользователь открывает диалоговое окно в первый раз: http://i43.tinypic.com/2dt9fk7.png

Когда пользователь снова открывает диалоговое окно: http://i40.tinypic.com/v6sqq9.png

Answer 1

Я в основном согласен с Cambraca;однако есть еще одна мысль, которую нужно добавить к пункту «Это CSS»:

Когда диалоговое окно закрывается, пользовательский интерфейс jQuery, похоже, не перемещает его обратно на свое первоначальное место в дереве DOM.Кажется, он перемещен прямо перед закрывающим тегом </body>.Поэтому для согласованности измените разметку так, чтобы она тоже начиналась там, что позволит избежать возможных проблем с наследованием стилей CSS.