How to display loading dialog when someone clicks a specific link?

Question

I do have an URL which opens a webpage which is very slow to load and I have no control over it.

I do want to display a loading dialog when someone clicks this URL or to block page with an overlay div when this happens.

Note: this is not the same question as the ajax related ones, this for normal URL clicks form the user, not all of them only specific ones.

<A href="http://veryslowload.com" onClick="...">slow load...</a>

I suppose that what I am looking for is what to put on the onClick.

Answer 1

You can do this :

$(function(){
​  $('a').click(function(){
     $('<div class=loadingDiv>loading...</div>').prependTo(document.body); 
  });​
});

Demonstration (change the link to a very slow page for best effect)

But it depends on the page : if the page sends immediately some content but not the whole content, you won't have the time to see your div.