What's New?

[CLOSED] [1.0] Do Not show page until all rendering has completed

  1. #1
    Nov 22, 2010, 4:34 PM

    [CLOSED] [1.0] Do Not show page until all rendering has completed

    I know there is a post where instructions were given how to leave a page white with an image until the page has completely rendered. I'm pretty sure vladimir gave the instructions. I can not find it.

    http://dev.sencha.com/deploy/dev/docs/

    I want it to work something like the above link where the page is white with 'Loading' until it is completely rendered.

    Can anyone else find that post - or - have the correct instructions? I'm apparently using the wrong search terms.

    Thank You~
    Last edited by Daniil; Nov 24, 2010 at 6:57 AM. Reason: [CLOSED]
  2. #2
    Nov 22, 2010, 6:33 PM
    Hi,

    Please investigate the following example.

    https://examples1.ext.net/#/Panel/Bo...Standard_Mask/
  3. #3
    Nov 22, 2010, 6:49 PM
    Hi,

    Please see the following sample

    <%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Ext.NET Example</title>
     
    <style type="text/css">
        .loading-indicator {
            font-size    : 11px;
            padding-left : 20px;
            height       : 18px;
            text-align   : left;
            background-repeat   : no-repeat;
            background-position : top left;
            background-image    : url(http://dev.sencha.com/deploy/dev/docs/resources/images/default/grid/loading.gif);
        } 
     
        #loading-mask {
            position : absolute;
            left     : 0;
            top      : 0;
            width    : 100%;
            height   : 100%;
            z-index  : 20000;
            background-color : white;
        }
         
        #loading {
            position : absolute;
            left     : 45%;
            top      : 40%;
            padding  : 2px;
            z-index  : 20001;
            height   : auto;
        }
         
        #loading img {
            margin-bottom : 5px;
        }
         
        #loading .loading-indicator {
            background : white;
            color      : #555;
            font       : bold 13px helvetica,arial,tahoma,sans-serif;
            padding    : 10px;
            margin     : 0;
            text-align : center;
            height     : auto;
        } 
    </style>
     
    <script type="text/javascript">
        var removeMask = function () {
            setTimeout(function () {
                Ext.get("loading").remove();
                Ext.get("loading-mask").fadeOut({ remove : true });
            }, 250);
        };
    </script>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server">
            <Listeners>
                <DocumentReady Handler="removeMask();" />
            </Listeners>
        </ext:ResourceManager>
         
        <div id="loading-mask" style=""></div>
        <div id="loading">
            <div class="loading-indicator">
                <img src="http://dev.sencha.com/deploy/dev/docs/resources/extanim32.gif" width="32" height="32" style="margin-right:8px;" align="absmiddle"/>
                Loading...
            </div>
        </div>
        
        <ext:Window runat="server" Title="Example" Html="Sample Window" Padding="5" />
    </form>
</body>
</html>
    Last edited by geoffrey.mcgill; Nov 22, 2010 at 7:11 PM.

Similar Threads

  1. [CLOSED] How to show ext:Window on Parent page in Nested page
    By ViDom in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: May 09, 2012, 2:33 PM
  2. [CLOSED] Suggestion for improving page size after rendering subclassed controls
    By smart+ in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Jan 27, 2012, 10:48 AM
  3. [CLOSED] Script tag HTML rendering on first page load
    By seanwo in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Aug 03, 2010, 8:31 PM
  4. [CLOSED] AjaxEvent/Listener -> request completed Linked Combos
    By jsemple in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: May 30, 2010, 6:55 AM
  5. [CLOSED] IE7 page rendering problem?
    By danielg in forum 1.x Legacy Premium Help
    Replies: 43
    Last Post: Mar 24, 2010, 4:54 PM

Tags for this Thread

Posting Permissions