[Plugin: Responsive Slider] Fade transition not working in IE8

Yes, I noticed this as well. I’m wondering if there is a fix for this?

Hello,

Just following up on our question from a couple weeks ago.

Wondering if there is a fix for the Fade Transition in IE8?

Thanks,
Aaron

Hello,

After some searching, I found this solution that seems to be working after very minimal testing.

https://stackoverflow.com/questions/2766735/jquery-fadein-fadeout-ie8-does-not-fade

Simply apply the following css to all elements within the

• elements:

filter: inherit;
opacity: inherit;

In my case, I made some modifications to the responsive-slider.php, so my css looks like this:

html.ie8 .responsive-slider.flexslider .slides li .slide,
html.ie8 .responsive-slider.flexslider .slides li .slide a,
html.ie8 .responsive-slider.flexslider .slides li .slide a img,
html.ie8 .responsive-slider.flexslider .slides li .slide-title,
html.ie8 .responsive-slider.flexslider .slides li .slide-title a,
html.ie8 .responsive-slider.flexslider .slides li .slide-title a h2,
html.ie8 .responsive-slider.flexslider .slides li .slide-title a p {
	filter: inherit !important;
	opacity: inherit !important;
}

I haven’t tested if every single element within the

• has to be declared, nor have I tested if the !important declarations are necessary, but I went ahead and did it anyway and it works.

  Hope that helps.

  Cheers,
  Aaron

A little late in the game, but based on Aaron’s finding, I found a simpler way. I just added this into my child theme’s CSS.

.responsive-slider.flexslider * {
	opacity: inherit; filter: inherit;
}

Don’t remove the asterisk.

My above IE8 “fix” breaks the slider on mobile devices. I couldn’t get IE8 hacks to work, so I removed it. IE8 is <8% of browsers, so I would rather support mobile browsers. I detest IE…