Take the 2-minute tour ×
Server Fault is a question and answer site for system and network administrators. It's 100% free, no registration required.

I've recently built a website from scratch which I'm very proud of (a new feat for me!) and have begun testing it in dreaded IE. I've noticed that in IE8 if I want to hover over any link it just takes a long time to do (upwards of 0.5seconds to recognize the mouse is over a link and to change to a 'click here' icon). It works 'fine' in IE6 and IE7.

When I take out 2 simple pictures (about 500KB and 100KB) the page seems to work fine. Why do these two pictures trip up IE8 so badly, yet every other browser can handle pictures of this size just fine? What can I do to fix it?

-Karl

share|improve this question
    
Not to sound unhelpful, but IE is generally slower than other browsers. Tweaking pages to perform in IE is what web developers spend a lot of time doing. To put a positive spin on it, IE forces web developers to code as efficiently as possible. –  Kyle Smith Oct 20 '09 at 14:46

1 Answer 1

up vote 2 down vote accepted

Most browsers don't download the image until you first put your mouse over it and the javascript flips it.

I suspect the other browsers cached the image, which is why they are fast, and IE8 maybe reloading it each time.

A 500KB image is pretty large for an image on a website, particularly one that is temporarily for something like a mouseover. I suggest you try to optimize the image by saving it in a compressed format of either jpg or gif.

Here is a javascript example of how to preload your images when the page loads.

var myImages = new Array ("Home.jpg", "HomeRoll.jpg");
var myPreload = new Array (); 
for (var i = 0; i < myImages.length; i++ )
{
    myPreload[ i ]= new Image();
    myPreload[ i ].src = myPics[ i ];
}
share|improve this answer
    
Where I am having problems there is no javascript, just a reference to a picture. I do like the idea of pre-loading images though, so thank you very much for that I will try taht as well. –  Karl Oct 20 '09 at 16:38
    
Are you using CSS hover to swap the image? –  Jack B Nimble Oct 20 '09 at 17:08
1  
I am sometimes yes, although I found the problem to be much simpler: essentially any picture over 50k in IE8 will significantly slow down both browsing and load time. I've tested this with many file sizes and 50k seems to be about the breaking point. Lesson of the day: Microsoft enjoys making life difficult for no reason. –  Karl Oct 20 '09 at 19:14

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.