Question : How to cache a large image?

Hello,

I want to cache a large image so that as user browses through web pages, the image loads up very quickly. The image is a pretty large image that I use as my header image. Please see the CSS file's snippet, and I am talking about  flowers.jpg image.

body
{
font-family: Verdana, Arial, Helvetica, sans-serif;
color:#333333;
 background-image:url(../../Images/flower_bg.png);
 background-repeat:repeat;
}  


#menu
{
    letter-spacing:.3em;
    position:absolute;
    width:980px;
    height:200px;
    top:15px;
    left:160px;
    z-index:500;
    text-align:left;
 background-image:url(../../Images/flowers.jpg);
 background-repeat:no-repeat;    
}
flowers.jpg is a big image with 980px × 200px dimensions, and the size is 163.84 KB.

flower_bg.png is a small image with dimension 10px × 8px, and its size is 0.27 KB.

My questions are:

1) Is it possible to save the flowers.jpg image at client side,
2) What I should do so that flowers.jpg loads up very fast as the user browses through web pages.
3) Do you think ASP .NET's @ OutputCache can be helpful here ( the reason I am not using it as the web pages have buttons for forms. Therefore, if I put <%@ OutputCache Duration="600" VaryByParam="none" %> at web pages, where there are buttons, form's button's will not trigger an event and will not generate result that the user wants to see); the reason I am asking as I do not know whether there is a way to use ASP .NET's @ OutputCache to cache the image flowers.jpg.

Any solution is okay with me. Please give me your advises on what to do. What is the most easiest way to cache the image flowers.jpg either by using javascript or by using asp .net c# so that the image loads up very quickly.



 

bgImageCache.jpg (15 KB) (File Type Details) 

LargeImageCache

Answer : How to cache a large image?

You can't decide to cache image on the client side for the user. Caching is a normal process, so the first time your image is loaded and the next time you want to load the page, browser caching is used.
You manage caching with the browser itself, not with Javascript or any other scripting language. You can't use user disk space without it's permission.

ASP .NET's @ OutputCache is used at server side to deliver fastly data :
http://msdn.microsoft.com/en-us/library/xsbfdd8c.aspx