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

?View Code JAVASCRIPT
/* Cross Browser jQuery Codes to Get Current Opacity
http://zenverse.net/get-current-opacity-in-msie-using-jquery-cross-browser-codes/
*/
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 • 25,169 visits 3 comments
Tags :


or Subscribe to specific category only :




  - 3 Comments


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!

Trackbacks

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

Leave a Reply

You must be logged in to post a comment.

Previous Post
«
Next Post
»