Previous Message
Next Message

CSS rollover flicker

Sent by Homeric on 7 September 2003 18:06

Greetings, Ryan!

>> I've been starting to use css rollovers recently and been having trouble with flickering
>> images.  I've been using the technique listed here:

>> This is supposed to eliminate the flickering and does indeed work in IE 5.5.  But
>> rollover images still flicker in IE 6 and on a slow modem connection can completely
>> disappear.  Does anyone have any experience with this?

> It seems to only happen if caching is set to "check every time". I
> tried to narrow it down and find a situation that eliminated the
> flicker but was unsuccessful.

> what I've found is that flickering occurs if anything happens on :hover
> OR if you have "background-repeat: no-repeat;" along with the
> background-image definition.

Not related to CSS, but solved my problem with CSS rollover flickering
and other caching issues in IE.

Check if your web server is not sending any Vary headers in responses to
IE (You can use Proxomitron at to see HTTP

If it does, there is a need to change the configuration so that it does
not send it to those who use IE (there is "MSIE" and no "Opera" in the
user-agent header of the request. IE4 to 6 never fixed the Vary header
bug, which makes all sites using Russian Apache (Vary: accept-charset,
user-agent) not cacheable in IE.

For Apache (1.3.6 and later), I use these lines to disable Vary headers
for some broken browsers:

        BrowserMatch "MSIE" brokenvary=1
        BrowserMatch "Mozilla/4.[0-9]{2}" brokenvary=1
        BrowserMatch "Opera" !brokenvary
        SetEnvIf brokenvary 1 force-no-vary

Put these into httpd.conf or .htaccess file.
This will disable Vary headers for all versions of IE. Opera will still
receive a Vary header (in any browser identification).


css-discuss [EMAIL-REMOVED]]
Supported by --
Previous Message
Next Message

Message thread: