jquery fadeToggle use visibility instead of display

Question

I currently am using jQuery("#addCaseMemberBtn").fadeToggle( "fast" ); but it is causing content to jump up/down when it completes because it is using display. How can I tell it to use visibility or accomplish the same thing with visibility so that the content does not jump.

Answer 1

You could toggle the opacity with animate():

$("button").click(function () {
    $("p:first").animate({opacity:($("p:first").css('opacity')==1)?0:1});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button>fadeToggle p1</button>
<p>This paragraph has a slow, linear fade.</p>
<p>This paragraph has no animation.</p>