Sign Up to our social questions and Answers Engine to ask questions, answer people’s questions, and connect with other people.
Login to our social questions & Answers Engine to ask questions answer people’s questions & connect with other people.
Lost your password? Please enter your email address. You will receive a link and will create a new password via email.
Please briefly explain why you feel this question should be reported.
Please briefly explain why you feel this answer should be reported.
Please briefly explain why you feel this user should be reported.
I have a 5MB Image that takes about 2-3 mins to load. While It loads, I want to have a loading screen. That loading screen will disappear after the images loaded. (The image is a sprite image; I use CSS to split it).
If this is possible, then how can I do it? If this isn’t possible, then what other ways can I use to hide the loading of the image (or lower the image size)?
Unless there is additional information which hasn’t been stated, at 5MB you have defeated any advantages of a CSS sprite. Split it into separate files and lazy load on demand.
If you are using/can use jQuery this plugin does a nice job lazy loading.
Also ensure that you are using the best compression possible. Even if you must use lossless compression, there are still some gains which can be made by removing metadata from the image files.
“Save for Web” in Photoshop is great for balancing lossy compression (quality versus size) and also gives you the option to not embed metadata in image files. You can use a tool like Yahoo SmushIt if you don’t have access to Photoshop.