[jQuery] JSON Jquery Load Animated GIF

[prakash123]

Hello

I have an animated GIF load, till the DOM is loaded

<!-- Page Uploading Progress bar Script -->

<div id="loading" style="position:absolute; width:100%; text-
align:center; top:300px;">
Loading Tax Software ... Please wait...<br>
<img src="imgs/progress_bar.gif" border=0></div>

<script>
 var ld=(document.all);
  var ns4=document.layers;
 var ns6=document.getElementById&&!document.all;
 var ie4=document.all;
  if (ns4)
        ld=document.loading;
 else if (ns6)
        ld=document.getElementById("loading").style;
 else if (ie4)
        ld=document.all.loading.style;
  function init()
 {
 if(ns4){ld.visibility="hidden";}
 else if (ns6||ie4) ld.display="none";
 }
 </script>


But i want the animated gif to continue till the JSON data is loaded.

$(document).ready(function(){

 jQuery.getJSON("scripts/data/country_data.js",function(jsonData) {
 $.each(jsonData,function(key,object) {

  $
("#foreign_country_info").addOption(object.Country_Code,object.Country);
  $("#foreign_country_info [EMAIL PROTECTED]'select']").attr('selected',
'true');

});


Can someone help me with this?

How do I continue to display the animated gif, till the json completes
loading?

Thanks