Question

I’m dynamically switching a div’s background-image with the jquery bit below. Works just fine in FF, but turns out in IE it does not. Any ideas why? Does IE not reload the image if a css property changed? Any pointers would be appreciated.

$(function(){
   $('.header').each(function(){
      $(this).hover(function(){
         $('#headertab').css('background-image','url(/tab_'+$(this).attr('href').split('path=')[1]+'.gif');
      });
   });
}); 

Answer 1

Try setting backgroundImage instead of background-image.

CSS attributes, when accessed via Javascript, traditionally use camelCase instead of dashes, to avoid questions of syntax. (element.style.background-image looks like you’re doing subtraction.) Firefox is probably progressive enough to allow the dashes as well, but IE… it would seem not.