Saturday, 3 September 2016

Show a loading gif while iframe page content loads using jQuery.

Display animated GIF image before iframe content is loaded
Description:

In this example we explain that Display animated GIF image before iframe content is loaded .or display gif image before iframe content is not loaded.

Suppose if you are working with iframe then iframe content take time to load,so if you may want to display a simple gif loading image that indicate the end user that loading process is working so wait for some time.
Code:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="LoadImageBeforeFrameContentLoad.aspx.cs"
    Inherits="LoadImageBeforeFrameContentLoad" %>

<!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 id="hd" runat="server">
    <title>Display animated gif before Iframe content is loaded</title>
    <script type="text/javascript">
        function hideLoading() {
            document.getElementById('dv_Loading').style.display = "none";
            document.getElementById('dv_Frame').style.display = "block";
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div id="dv_Loading">
        <img src="images/ajax-loader.gif" alt="" />
    </div>
    <div id="dv_Frame" style="display: none">
        <iframe src="http://aspsolutionkirit.blogspot.in" onload="hideLoading()" frameborder="0">
        </iframe>
    </div>
    </form>
</body>
</html>




0 comments:

Post a Comment