Get Current Opacity in MSIE using jQuery (Cross Browser Codes)

Posted in Web Development on 27 January 2011 3 comments

When I was developing theme, I found a weird problem in IE8. This is the case: I have a DIV that has opacity of 0.4. When I use $(elem).css(‘opacity’) to get its current opacity, it works fine in all browser except IE8, which return opacity of 1.

I started to find ways to get the correct current opacity value in IE. Then I realised I have filter:alpha(opacity=40) in my css, which is IE’s version of opacity. I started to work from there, and this is the code I use in my photoblog theme, which will be up selling real soon :)

Cross Browser jQuery Codes to Get Current Opacity

/* Cross Browser jQuery Codes to Get Current Opacity
function getopacity(elem) {
  var ori = $(elem).css('opacity');
  var ori2 = $(elem).css('filter');
  if (ori2) {
    ori2 = parseInt( ori2.replace(')','').replace('alpha(opacity=','') ) / 100;
    if (!isNaN(ori2) && ori2 != '') {
      ori = ori2;
  return ori;
//to use it
var currentopacity = getopacity('div.the-element');

This is how it works:

1. First, it retrieves opacity & filter property of the matched element.
2. If filter property is undefined, the value from opacity property will be used.
3. If filter property is defined and it is a numeric value, the value from filter property will be used.

Hope this helps.


Posted by Zen on 27 January 2011 • 29,907 visits 3 comments
Tags :

or Subscribe to specific category only :


lesso says:

I like very much you side…

David says:

This worked perfectly for me. Using the variable, I can increment opacity triggered by a click. Thanks!


  1. The Week In Health Reform | 健康知识_养生保健_健康饮食_生活小常识大全-健康知识网

Leave a Reply

You must be logged in to post a comment.

Previous Post
Next Post