ted serbinski – entrepreneur & web architect
  • thoughts
  • about
  • contact



Popular content

  • OpenDNS
  • Rebuilding a BMW intake: S52 to M50 intake manifold conversion, day 6
  • Going to London tomorrow!
  • MothersClick Acquired by Lifetime Networks
  • The US Government on Open Source
  • 2nd Annual "Cookbook for Moms"
  • Getting Textile to work with Digg This button (and other SCRIPT tags)
  • BMW E39 minivan taker
  • My Apt is Haunted!
  • Rebuilding a BMW intake: S52 to M50 intake manifold conversion, day 2
more

Recent comments

  • Unfortunately this method
    2 weeks 1 day ago
  • I’m using this method to sort
    7 weeks 18 min ago
  • I was interested in reading
    8 weeks 5 days ago
  • Ah yes this code is a bit out
    12 weeks 2 days ago
  • After using the original code
    12 weeks 2 days ago
more

Topic “ie6”

Drupal Behavior to Fix IE6 CSS Background Image Flickering

When the new myLifetime community launched we wanted to focus on performance, and one trick was to minimize HTTP requests by using the CSS sprites technique. For a great run down of this technique and examples of other major sites using this, check out this resource on Smashing Magazine.

Double checking this implementation with YSlow! everything was working great.

Well almost. Then we tried IE6. I hate IE6.

Then I discovered this excellent post detailing IE6 and its BackgroundImageCache usage.

After trying that JS trick, we noticed the page was significantly faster & smoother in IE6. With heavy CSS sprite usage this was a necessary fix. And with future sites in the works with this same technique, seems like a reoccurring fix.

To Drupal-ize & jQuery-ize this fix for resuability, I wrote this simple behavior below that works with Drupal 6. You can see in action on the myLifetime community.

  1. /**
  2.  * Fix flickering background images in IE.
  3.  */
  4. Drupal.behaviors.fixIEFlickr = function() {
  5.   if (jQuery.browser.msie) {
  6.     try {
  7.       document.execCommand('BackgroundImageCache', false, true);
  8.     } catch(err) {}
  9.   }
  10. };

May this code save you a few hours/days of head banging!

posted 11 May 2009
  • css
  • drupal
  • ie6
  • jquery
  • 5 comments
Code examples and downloadable zip files of code are licensed under a Creative Commons License.
All other content, unless where noted, ©2010 Theodore Serbinski. All Rights Reserved.