title: How to make loading animation gif invisiable on complete of getjson call and display jw player instead?
body: <p>I want to show an loading animation on load of page and remove the loading animation when getjson called completes successfully and show my jw player code at end of getjson completion. Right now my loading animation is visible at all time. Could you guys show me how i can make the animation loading invisible at end of getjson call and show my jw player instead ?</p>
  
  <p>My loading animation image:</p>
  
  <pre><code>&lt;td rowspan="4"&gt;&lt;img src="./loading.gif" width="304" height="287"&gt;&lt;/td&gt;
  </code></pre>
  
  <p>and my getjson call:</p>
  
  <pre><code>&lt;script&gt;
  $.getJSON('http://www.somesite.com/getmedia.php?id=1234&amp;callback=?', function(data){
  var mediaUrl = data.contents;
  jwplayer().load({file: mediaUrl+".flv"});
  
  });
  
  &lt;/script&gt;
  </code></pre>
  
  <p>jw player that should become visiable at end of getjson call:</p>
  
  <pre><code>&lt;script type='text/javascript' src='./jwplayer.js'&gt;&lt;/script&gt;
  
  &lt;div id='mediaspace'&gt;This text will be replaced&lt;/div&gt;
  
  &lt;script type='text/javascript'&gt;
    jwplayer('mediaspace').setup({
      'flashplayer': './player.swf',
      'autostart': 'true',
      'controlbar': 'bottom',
      'width': '470',
      'height': '320'
    });
  &lt;/script&gt;
  </code></pre>