jQuery toggle both "slide" and "fade" animations at the same time

Question

jQuery has a slideToggle, and a fadeToggle, but they don't play well together (see fiddle here):

$('div').on('click', function () {
    $('span')
        .slideToggle({duration: 'slow', queue: false})
        .fadeToggle({duration: 'slow', queue: false});
});

How can I have slide and fade toggle at the same time?

Answer 1

Use .animate() as follows:

$('span').animate({
  height: "toggle",
  opacity: "toggle"
});