New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Page Loading Animation

ShowContentDuringLoading="false"

ShowContentDuringLoading="true"

  • Demo Configurator
Choose siteBing
The RadWindow'sShowContentDuringLoad property controls whether RadWindow will show the page while it is loaded or will wait until the page is completely loaded (e.g. window.onload is fired in the content page). If ShowContentDuringLoad is set to false, RadWindow will display a loading image that can be controlled with CSS.

Note:
If you intend to show a PDF file in RadWindow instead of a standard page, make sure that ShowContentDuringLoad is set to true. Otherwise if the loaded content is not a page, window.onload will not be fired and RadWindow will not show the content.
  • DefaultCS.aspx
  • scripts.js
  • styles.css
<%@ Page Language="C#"  %>

<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <link href="styles.css" rel="stylesheet" />
    <script src="scripts.js" type="text/javascript"></script>
    <script type="text/javascript">
        //<![CDATA[
        $contentWindowDemo.win1 = "<%=RadWindow1.ClientID %>";
        $contentWindowDemo.win2 = "<%=RadWindow2.ClientID %>";
        //]]>
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <div class="demo-containers">
        <div id="invisible-loading-container" class="demo-container size-thin">
            <h2>ShowContentDuringLoading="false"</h2>
            <telerik:RadWindow RenderMode="Lightweight" ID="RadWindow2" runat="server" Height="300px" Width="300px" NavigateUrl="http://www.bing.com" VisibleOnPageLoad="true" ShowContentDuringLoad="false" OffsetElementID="invisible-loading-container" Left="30" Top="60" />
        </div>
        <div id="visible-loading-container" class="demo-container size-thin">
            <h2>ShowContentDuringLoading="true"</h2>
            <telerik:RadWindow RenderMode="Lightweight" ID="RadWindow1" runat="server" Height="300px" Width="300px" NavigateUrl="http://www.bing.com" VisibleOnPageLoad="true" ShowContentDuringLoad="true" EnableShadow="true" OffsetElementID="visible-loading-container" Left="30" Top="60" />
        </div>
    </div>
    <qsf:ConfiguratorPanel runat="server">
        <Views>
            <qsf:View runat="server">
                <qsf:DropDownList ID="RadComboBox1" Label="Choose site" runat="server" OnClientSelectedIndexChanged="OnClientSelectedIndexChanged">
                    <Items>
                        <telerik:DropDownListItem Text="Bing" Value="http://www.bing.com" />
                        <telerik:DropDownListItem Text="KendoUI" Value="http://www.kendoui.com" />
                        <telerik:DropDownListItem Text="W3C" Value="http://www.w3.org/" />
                    </Items>
                </qsf:DropDownList>
            </qsf:View>
        </Views>
    </qsf:ConfiguratorPanel>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance