如何在弹出窗口中打开更新进度 [英] How to Open Update Progress in Pop-Up

查看:62
本文介绍了如何在弹出窗口中打开更新进度的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

朋友我需要你的帮助。

i我的网页点击弹出窗口中的添加我正在使用java脚本打开另一个页面。

因为我我在弹出窗口中调用另一个页面,所以这需要一点时间,所以我只想包含一个进度条,直到网页进入弹出窗口。

我该怎么做.. ?? br />
我的代码是

Friends i need help from your side.
i my web page on clicking "ADD" in a popup window i am opening another page using java script.
since i am calling another page in popup so it's take little bit of time so i just want to include a progress bar until the webpage come in the popup window.
how can i do it..??
my code is

<head>
    <style type="text/css">
        body {
            font-family: 'Segoe UI';
            font-size: 12px;
        }

        table {
            margin-left: 20px;
        }

        .col1 {
            width: 40%;
        }

        .col2 {
            width: 60%;
        }

        .textbox {
            width: 200px;
        }

        table tr {
            height: 40px;
        }

        .button {
            height: 30px;
            width: 70px;
        }

            .button:hover {
                background-color: #0094ff;
                border-color: #0094ff;
                color: white;
            }

        ul li {
            display: inline;
            margin-left: 10px;
        }

        a {
            text-decoration: none;
        }

        .modal-overlay {
            position: fixed;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            height: 100%;
            width: 100%;
            margin: 0;
            padding: 0;
            background: #fff;
            opacity: .75;
            filter: alpha(opacity=75);
            -moz-opacity: 0.75;
            z-index: 101;
        }

        .modal-window {
            position: fixed;
            top: 50%;
            left: 60%;
            margin: 0;
            padding: 0;
            z-index: 102;
            border:1px solid black;
            
        }

        .close-window {
            position: absolute;
            width: 32px;
            height: 32px;
            right: 8px;
            top: 8px;
            background: transparent url('black_delete.png') no-repeat scroll right top;
            text-indent: -99999px;
            overflow: hidden;
            cursor: pointer;
            opacity: .5;
            filter: alpha(opacity=50);
            -moz-opacity: 0.5;
        }

            .close-window:hover {
                opacity: .99;
                filter: alpha(opacity=99);
                -moz-opacity: 0.99;
            }
    </style>
    <script type="text/javascript">
        var modalWindow = {
            parent: "body",
            windowId: null,
            content: null,
            width: null,
            height: null,
            close: function () {
                $(".modal-window").remove();
                $(".modal-overlay").remove();
            },
            open: function () {
                var modal = "";
                modal += "<div class=\"modal-overlay\"></div>";
                modal += "<div id=\"" + this.windowId + "\" class=\"modal-window\" style=\"width:" + this.width + "px; height:" + this.height + "px; margin-top:-" + (this.height / 2) + "px; margin-left:-" + (this.width / 2) + "px;\">";
                modal += this.content;
                modal += "</div>";

                $(this.parent).append(modal);

                $(".modal-window").append("<a class=\"close-window\"></a>");
                $(".close-window").click(function () { modalWindow.close(); });
                $(".modal-overlay").click(function () { modalWindow.close(); });
            }
        };
        var openMyModal = function (source) {
            modalWindow.windowId = "myModal";
            modalWindow.width =800;
            modalWindow.height = 600;
            modalWindow.content = "<iframe width='800' height='600' frameborder='0' scrolling='no' allowtransparency='true' src='" + source + "'></iframe>";
            modalWindow.open();
        };
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div class="main">
            <span style="font-size: 26px; margin-removed 20px;">Organization Unit</span>
            <table>
                <colgroup>
                    <col class="col1" />
                    <col class="col2" />
                </colgroup>
                <tr>
                    <td>Name Of Unit</td>
                    <td>
                        <asp:TextBox ID="txtunitname" runat="server" CssClass="textbox"></asp:TextBox></td>
                </tr>
                <tr>
                    <td>Parent Unit</td>
                    <td>
                        <a href="tree.aspx" target="_blank"  önclick="openMyModal('tree.aspx'); return false;">
                            ADD</a>
                        <asp:TextBox ID="txtparent" runat="server" CssClass="textbox"></asp:TextBox>
                    </td>
                </tr>
</table>





提前感谢帮助我.. !!

:)



thanks in advance for helping me..!!
:)

推荐答案

.modal-window)。remove() ;
(".modal-window").remove();


.modal-overlay)。删除();
},
open: function (){
var modal = ;
modal + = < div class = \modal-overlay \>< / DIV>中;
modal + = < div id = \ + .windowId + \class = \模态窗口\style = \width: + this .width + < span class =code-string> px; height:
+ this .height + PX; margin-top: - +( this .height / 2 )+ px; margin-left: - +( this .width / 2 )+ px; \>;
modal + = .content;
modal + = < / div>;
(".modal-overlay").remove(); }, open: function () { var modal = ""; modal += "<div class=\"modal-overlay\"></div>"; modal += "<div id=\"" + this.windowId + "\" class=\"modal-window\" style=\"width:" + this.width + "px; height:" + this.height + "px; margin-top:-" + (this.height / 2) + "px; margin-left:-" + (this.width / 2) + "px;\">"; modal += this.content; modal += "</div>";


this .parent).append(modal);
(this.parent).append(modal);


这篇关于如何在弹出窗口中打开更新进度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆