0

スクロールバー付きの大きなコンテナがあります。

jquery UI を使用したモーダル ダイアログが、このコンテナーの中央で開きます。

ダイアログが開きますが、何度も閉じて開いた後、上下に移動します（したがって、常に間違った位置になります）。

このスレッドから追加しましたJQuery UI ダイアログは、次の部分を開いたり閉じたりする間の位置を記憶できますか:

beforeclose: function(){
   $(this).dialog('option', 'position', [$(this).offset().left, $(this).offset().top]);
}

この部分を削除すると、常にページの上にドラッグ/移動した後にダイアログが開きます。

また、一番下のダイアログを開くと、さらにクレイジーな動きになります。

私のコード:

$("#btnTest").click(function(){
  if ($("#exec").length == 0) {

            $('body').append('<div id="exec" style="width:320px;background-color: #000;display:none;">xxx</div>');

          $("#exec").dialog({
            width: 320,
            modal: true,
            position: "center",
            show: { effect: "slide", direction: "up", duration: 400 },
            hide: { effect: "slide", direction: "up", duration: 400 }
         });
       } else {
            $("#exec").dialog("open");
        }
 });

$("#btnClose").click(function(){
    $("#exec").dialog('close');
});

@ jsfiddle で確認してください: http://jsfiddle.net/EDkk6/4/

4

2 に答える 2

1

モーダルを再度開くと、トップの位置に 20px の違いがあるように見えます。これは、オフセットで考慮していない親div内にUIダイアログが作成されているためだと思います。したがって、次のように親に基づいてオフセットを取得する必要があります。

beforeclose: function () {
    var $parent = $(this).parent();

    $(this).dialog('option', 'position', [$parent.offset().left,$parent.offset().top]);
}

ライブデモ

于 2012-09-10T12:39:03.077 に答える
0

次の行を置き換えます。

beforeclose: function(){
   $(this).dialog('option', 'position', [$(this).offset().left, $(this).offset().top]);
}

と：

beforeclose: function(){
   $(this).dialog('option', 'position', [$(this).offset().left, $(this).offset().top-20]);
                                                                                     ^^ Added -20 with offset().top
}

デモを見る

于 2012-09-10T12:54:42.373 に答える