Resim yüklenirken Loading.gif koyabilirmiyim?

Merhaba arkadaşlar bir resim sitesi yaptım ve resimlerde sayfalamayıda javascript ile gerçekleştirdim temel olarak butona basıldığı anda html in içindeki <img /> tagının Src sini değiştiriyorum ve resimde değişiyor.

Ancak resimler 1-2 mb boyutlarında olduğu için oldukça fazla bekletiyor yüklerken bu bekletmeye karşı birşeyler çıkartmak istiyorum mesela butona basıldığı anda resim yüklenene kadar 3-5 kb lık loading.gif çıkartma gibi..

Acaba bu mümkünmüdür?

Birşey daha var mesela 2. butona tıklandı ve 2. resim açıldı 1. resme dönüleceği zaman resmi baştan tekrar yüklüyor ancak sayfa açıldığında zaten o 1. resim yüklemişti.

Acaba açılan resimleri önbelleğe aldırmak mümkünmü?

Şimdiden teşekkürler, sağ olun...

Bunu ajax ile yapıyorlar sanırım.

aynen bende ajax diye biliyorum

jquery ajax ile şöyle yapabilirsin

$('#senin divin').html('<img src="yukleniyor.gif">')

JS ve Ajax ile;

if(http.readyState == 1) // "1" => "Yukleniyorken" anlamını verir
{
document.getElementByID('senindiv').innerHTML = '<img src="yukleniyor.gif" />';
}
else if(http.readyState == 4) // "4" => "Yuklendiginde" anlamını verir
{
document.getElementByID('senindiv').innerHTML = '<img src="yuklenen.resim" />';
}

Gibi bir kod yazman gerekir. Ajax ile biraz deneme yap. Öğrenmesi zor değil.

css'ye bu konu ekle

kullanırken de

sanırım böyle olacak