I'd like to somehow get the target opacity (the final value it is being animated to) of an element that is fading.
For example...
$('body').fadeTo(0.4); // 0.4
$('body').fadeIn(); // 1
$('body').fadeOut(); // 0
$('body').animate({ opacity: 0.7 }); // 0.7
Is this doable in jQuery?
For some background, see my answer here on Stack Overflow. I was trying to help out another user on SO and decided to ask this question that related to my answer.
The . fadeTo() method animates the opacity of the matched elements. It is similar to the . fadeIn() method but that method unhides the element and always fades to 100% opacity.
jQuery fadeIn() Method The fadeIn() method gradually changes the opacity, for selected elements, from hidden to visible (fading effect). Note: Hidden elements will not be displayed at all (no longer affects the layout of the page).
jQuery Effect fadeTo() MethodThe fadeTo() method gradually changes the opacity, for selected elements, to a specified opacity (fading effect).
jQuery uses step functions internally, you can overwrite the jQuery.fx.step.opacity
function to read the passed jQuery.fx
object:
var old = jQuery.fx.step.opacity;
jQuery.fx.step.opacity = function( fx ) {
console.log(fx.elem);
console.log(fx.end);
return old(fx);
};
The opacity step function is called on every step of every opacity animation. You would probably want to filter the above based on fx.elem
.
fx.end
is the final value of the animation, fx.now
is the current value and fx.start
is the starting value. fx.unit
is the unit of the values (in px, em, %, etc).
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With