Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery: Can you find the selected element's opacity with jQuery?

I have a filter running on a set of list elements which fades the lesser desirable elements down to 0.25 opacity but I'd love to have their opacity return to 1 and then back down to 0.25 on hover over and out. Is this fairly simple to do?

I'm only having trouble finding a way to grab the selected element's current opacity so I can store it in a variable for use.

$('#centerPanel li').hover(function(){
        var currentOpacity = $(this).?????
        $(this).fadeTo(1,1);
    },
    function(){
        $(this).fadeTo(1,currentOpacity);
    });
like image 771
Steckel Avatar asked Jun 04 '10 09:06

Steckel


People also ask

How to get opacity in jQuery?

You need to set the mouseout opacity var outside the function, this will prevent your function to change that value. nohoverOpacity = $('#centerPanel li'). css("opacity"); hoverOpacity = 1; dur = 1000; $('#centerPanel li').

How to check visibility in jQuery?

You can use the jQuery :visible selector to check whether an element is visible in the layout or not. This selector will also select the elements with visibility: hidden; or opacity: 0; , because they preserve space in the layout even they are not visible to the eye.

What is opacity in jQuery?

jQuery Effect fadeTo() MethodThe fadeTo() method gradually changes the opacity, for selected elements, to a specified opacity (fading effect).

How can set opacity of div in jQuery?

As theIV said you can use the css method, but as an alternative you can use animate: $('#my_element'). animate({ opacity: 0.5 }, 100); this will animate the opacity of you div (and its contents) to 0.5 (from whatever it was to begin with) in 100 milliseconds.


2 Answers

Try $(this).css("opacity")

source

like image 180
Jeriko Avatar answered Sep 20 '22 05:09

Jeriko


there are complete guide "Get Current Opacity in MSIE using jQuery" http://zenverse.net/get-current-opacity-in-msie-using-jquery-cross-browser-codes/

code:

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');
like image 33
dirt Avatar answered Sep 19 '22 05:09

dirt