In asp.net-mvc, How can I show a loading image while my other image is getting generated from Url.Action?

Question

I have the following code:

 <img src="<%= Url.Action("LocationMap") %>" id="overlay" /> 

and it takes a little while for this to generate (as i am generating an image on the fly).

How can i show a "Loading . ." image or message, while this is being retrieved because right now it shows a broken image link until the image is loaded then it looks good . .

Answer 1

Something like this ?

It just says to add code similar to the following:

<script>
  $('img').load(function() {
      //Hide Loading Mask;
  });
</script>