装载图像被挂起而不是旋转

时间:2013-05-15 15:56:01

标签: javascript html jsp servlets

我想显示加载图片,直到响应页面加载为止。
在这里我提交表单,servlet将服务请求并需要2次发送响应。直到那时我想要显示类似于下面的图像。

  

http://www.consultingmag.com/cmag_media/pageLoading.gif

如果我使用onbeforeunload事件,则图像被挂起并且没有动画。但是为了检查目的,使用onload并按预期工作。
请帮帮我...谢谢。

  

示例代码

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
     <HEAD>
      <TITLE>Servlet</TITLE>
      <script type="text/javascript">
        function showBackgroundDiv() {
            var obj = document.getElementById("docBackground");
            if (obj != null && obj != undefined) {
                hideFormDiv();
                obj.style.visibility = "visible";
                resizeBackgroundDiv();
            }
        }

        function hideFormDiv() {
            var obj = document.getElementById("formDiv");
            if (obj != null && obj != undefined) {
                obj.style.visibility = "hidden";
            }
        }

        function resizeBackgroundDiv() {
            var obj = document.getElementById("docBackground");
            if (obj != null && obj != undefined
                    && obj.style.visibility == 'visible') {
                var frameObj = document.getElementsByTagName("iframe")["TransFrame"];
                if (frameObj != null && frameObj != undefined) {
                    frameObj.style.height = document.body.scrollHeight + "px";
                    frameObj.style.width = document.body.scrollWidth + "px";
                }
                obj.style.width = document.body.scrollWidth;
                obj.style.height = document.body.scrollHeight;
            }
        }
    </script>
     </HEAD>

    <BODY onbeforeunload="showBackgroundDiv()" onResize="resizeBackgroundDiv()">
        <div id="formDiv">
            <form action='hello' method='get'>
            Name : <input type='text' name='name'>
            <input type='submit' value='send'>
            </form>
        </div>
        <div id="docBackground"
            style="VISIBILITY: hidden; position: absolute; overflow: hidden; z-index: 100; top: 0px; left: 0px">
            <iframe src="TransPage.html" style="height: 0px; width: 0px;"
                frameborder="0" name="TransFrame" scrolling="no"> </iframe>
        </div>


    </BODY>

    </HTML>

0 个答案:

没有答案