3

次のコードがありますが、ダイアログは常にオーバーレイの下に表示されるため、これで終わりです。任意のアドバイスが最も高く評価されます：

<head runat="server">
    <title></title>
    <link href="../Styles/jqModal.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
        #shift-edit-popup
        {
            display: none;
        }
    </style>
    <script src="../Scripts/jquery-1.4.2.js" type="text/javascript"></script>
    <script src="../Scripts/jqModal.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $("#shift-edit-popup").jqm({
                toTop: true
            }).jqmAddTrigger("#show-button");
        });
    </script>
</head>
<body>
    <form id="form" runat="server">
    <input id="show-button" type="button" value="Show" />
    <div id="shift-edit-popup">
        <div>
            <asp:Label ID="resourceLabel" runat="server" AssociatedControlID="resourceList">Resource:</asp:Label>
            <asp:DropDownList ID="resourceList" runat="server" DataTextField="Name" DataValueField="ResourceId" Width="120px">
            </asp:DropDownList>
        </div>
    </div>
</body>
4

6 に答える 6

2

私が見て試したことから、ダイアログdivに含まれているjqmWindowクラスを使用して、これをドロップする必要があります。

<style type="text/css">
    #shift-edit-popup
    {
        display: none;
    }
</style>

コードは次のようになります。

<head runat="server">
    <title></title>
    <link href="Scripts/jqModal.css" rel="stylesheet" type="text/css" />

    <script src="Scripts/jquery-1.4.2.js" type="text/javascript"></script>
    <script src="Scripts/jqModal.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $("#shift-edit-popup").jqm({
                toTop: true,
                modal: true
            }).jqmAddTrigger("#show-button");
        });
    </script>
</head>
<body>
    <form id="form" runat="server">
    <input id="show-button" type="button" value="Show" />
    <div id="shift-edit-popup" class="jqmWindow">
        <div>
            Resource:
            <select><option value="1">One</option><option value="2">Two</option></select>
        </div>
    </div>
</body>

（スクリプトとcss参照を適宜変更する必要があります）

于 2010-05-04T16:07:18.137 に答える
1

私はあなたがshift-edit-popupの位置を設定する必要があると信じています：

<style type="text/css">
    #shift-edit-popup
    {
       display: none;
       position : relative;
    }
</style>
于 2010-05-04T14:07:58.637 に答える
1

どのバージョンのjqModal.jsを使用していますか？

http://dev.iceburg.net/jquery/jqModal/の最後の公式バージョンはjQuery1.4.xと互換性がありません（http://forum.jquery.com/topic/jqdnr-dragging-problem-with-jqueryを参照） -1-4およびhttp://www.trirand.com/blog/?page_id=393/bugs/jqgrid-jquery-1-4/）。

ご使用のバージョンで「$（）」がjqModal.js内に存在する場合は、「$（document）」に置き換える必要があります。jqGridパッケージの一部として修正バージョンをダウンロードすることもできます：http：//www.trirand.com/blog/？page_id = 6 。

于 2010-05-06T15:54:51.573 に答える
0

少し前にこのような問題に遭遇しました。DOCTYPEを次のように変更してみてください。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
于 2010-05-07T01:16:19.823 に答える
0

オーバーレイとモーダルボックスのz-index値を確認します。

于 2010-04-30T14:51:44.923 に答える
0

おそらくこれは読むのに役立つでしょう：z-indexを理解する

于 2010-05-04T02:16:12.857 に答える