0

我想为登录/注册制作一个弹出窗口。所以我写了这段代码。 但不工作...

.css

#main_box
{
    border: 1px solid black;
    height: 300px;
    left: 34%;
    position: fixed;
    top: 32%;
    width: 300px;
}

#close_btn
{
    float: right;
}

#main_box
{
    display: none;
}

#box_a, #box_b
{
    float: left;
}

#box_a, #box_b, #box_c
{
    border: 1px solid black;
    height: 82px;
    width: 82px;
    margin: 10px;
}
</style>

.js

  <script type="text/javascript">
            $(document).ready(
        function () {
            $('#login_btn').click(
                    function () { $('#main_box').show(); }
                );       
            $('#forgt_p').click(
                    function () { $('#box_c').show(); }
                );    
            $('#close_btn').click(
                    function () { $('#main_box').hide(); }
                );
         }
         );
     </script>

.aspx

    <a href="javascript:;" id="login_btn">login</a>

    <div id="main_box">         

        <button id="close_btn" name="close">close</button>
        <div id="box_a">                      
            //////////////////////login code
        </div>

        <div id="box_b">
            //////////////////////signup code            </div>
        <div style="clear: left;"></div>
             <a href="javascript:;" id="forgt_p">forgot password</a>

        <div id="box_c">
             //////////////////////forgot password code
        </div>

</div>

还想在按下转义时关闭它，并通过 jquery 使其尽可能顺利地工作

4

1 回答 1

0

您应该考虑令人惊叹的JQueryUI插件，例如对话框

它允许创建具有大量选项的 CSS 样式对话框：

$(function() {
    $( "#dialog-message" ).dialog({
        modal: true,
        buttons: {
            Ok: function() {
                $( this ).dialog( "close" );
            }
        }
    });
});
于 2012-10-26T06:55:35.000 回答