display "page loading" message
<p>I'm trying to display an image (.gif) for "page loading" in html page until the output from my_script.py gets displayed, and I've no idea how to do that. <a href="http://jsfiddle.net/9X4gW/" rel="nofollow">This</a> is what I've got so far. Many thanks in advance.</p>

<p><strong>HTML:</strong></p>

<pre><code>&lt;div id="loading"&gt;
   &lt;p&gt;&lt;img src="./images/loading.gif" /&gt; Please Wait&lt;/p&gt;
&lt;/div&gt;

&lt;form action="./cgi-bin/my_script.py" method="post" enctype="multipart/form-data" name="fname"&gt;
   &lt;input type="submit" id="submit" value="Submit" /&gt;
&lt;/form&gt;
</code></pre>

<p><strong>js:</strong>    </p>

<pre><code> $(document).ready(function() {
        $("form").submit(function() {
            showLoading();
            $('#content').load('./cgi-bin/my_script.py', null, showResponse);
        });

        function showResponse() {
            hideLoading();
        }

        function showLoading() {
            $("#loading").show();
        }

        function hideLoading() {
            $("#loading").hide();
        }
    });
</code></pre>
