jquery load not working in IE8

Question

Hi

web page : http://sideradesign.com/eco-art/gallery/

This code works fine in all brwosers except IE8 (haven't tested IE6/7)

jQuery(function () {
  jQuery("#main-content").append("<img src='../images/ajax-loader.gif' id='ajax-loader' />");
  $ajaxSpinner = jQuery("#ajax-loader");
  var thisTarget = jQuery('#thumbnail-nav ul li:eq(0) a.thumb').attr('href');
  jQuery('#main-content').load(thisTarget + " .entry-content");
  jQuery('a.thumb').click(function () {
    $ajaxSpinner.fadeIn();
    jQuery('#main-content').animate({
        opacity: "0.1"
    });
    thisTarget = jQuery(this).attr('href');
    jQuery('#main-content').load(thisTarget + " .entry-content", function () {
        $ajaxSpinner.fadeOut();
        jQuery('#main-content').animate({
            opacity: "1"
        });
    });
    return false;
});

});

Answer 1

IE doesn't support the opacity property in CSS, so animating it from jquery isn't going to work. Instead you could use fadeTo, which works around this problem.

Answer 2

It's the CSS that's causing the problem. I disabled the stylesheet and I can see the content appearing. this is resolved