FlyingCat
FlyingCat

Reputation: 14290

How to detect if the browser is loading

I am trying to show a loading image when a users click a link that will show a large image in the same page.

I was wondering what's best way to detect image loading WHILE the page has been loaded already (so window.onload() doesn't work).

Upvotes: 1

Views: 184

Answers (3)

Majid Fouladpour
Majid Fouladpour

Reputation: 30272

$("img.loader").show();
$("img.big").ready(function() {
  $("img.loader").hide();
}):

Upvotes: 2

Yuriy Galanter
Yuriy Galanter

Reputation: 39777

Add "onclick" event to your link, in which via setTimeout show your loading image. E.g.

<a href="...some slow loading page" onclick="setTimeout(showLoading,1)">Link Text</a>

function showLoading() {
   // Code to show "Loading..."
}

Upvotes: 0

Alex W
Alex W

Reputation: 38253

Load the image with JavaScript and then you can use the image's onLoad attribute:

Image1 = new Image();
Image1.src = 'photo.gif';

/* Code here to display loading hour glass etc */

Image1.onload = function() {
                           /* Image has loaded here */
                        }

Upvotes: 2

Related Questions