Dhaval Marthak
Dhaval Marthak

Reputation: 17366

Opacity IE 8 Fallback with jQuery

I have gone through this post:

Set opacity with javascript in IE 8?

This was purely done with javascript, i am using jQuery so i want to set opacity in IE8 but i am not getting succeed using jQuery.

so far i am doing like this:

$('.set').click(function (e) {
         var hiddenSection = $('div.hidden');
         hiddenSection.fadeIn()
         .css({ 'display': 'block' })
         .css({ width: $(window).width() + 'px', height: $(window).height() + 'px' })
         .css({ top: ($(window).height() - hiddenSection.height()) / 2 + 'px',
         left: ($(window).width() - hiddenSection.width()) / 2 + 'px'})
         .css({ 'background-color': 'rgb(190,190,190)'}) //Here bgcolor
         .css({ 'filter': 'alpha(opacity=1000)' }) // here opacity 
         .appendTo('body');
         $('span.close').click(function () { $(hiddenSection).fadeOut(); });
});

Is there anyway to achieve this CSS opacity in IE 8, the i know IE8 doesn't support opacity, but the post that i mentioned gets this done in IE 8 also.

This sentence .css({ 'filter': 'alpha(opacity=**val**)' }) might have something to break.

How can i get this working in IE 8?

Note:

Please avoid rgba() i know its also doesn't work with IE 8

Any help is greatly appreciated.

Upvotes: 0

Views: 4406

Answers (1)

JAM
JAM

Reputation: 6205

Try this:

  /* IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";

  /* IE 5-7 */
  filter: alpha(opacity=50);

So in your case:

.css({ '-ms-filter': 'progid:DXImageTransform.Microsoft.Alpha(opacity=**val**)' })

The filter opacity value can be an integer between 0 and 100.

Read more HERE.

Upvotes: 2

Related Questions