Search code examples

Hiding page elements using jQuery animations without it leading to display: none;

I'm using the Uploadify plugin to upload files to my server, and I want the upload form to fade away and the progress bar to fade in once the upload initializes. Only problem is, Uploadify stops working when the upload form gets the display: none; property, which all jQuery fading effects seem to lead to after their duration.

I tried doing:

$('#upload-form').css('opacity', 0);

which works. The upload continues after the form is hidden, but it doesn't have a fading effect.

Any solution? Thanks!


  • You can use jQuery.animate:

        opacity: 0
    }, 'slow');