jquery: animate function problem
<p>i start learning jquery just yesterday. i have a div element with some content, and i want to hide it by changing it's height:
here is the script</p>

<pre><code> &lt;script type="text/javascript"&gt;
    $(document).ready(function(){
        $("#hide").click(function(){
            $("#cont").animate({
                height: '0'
                },1500);
            $("#cont").hide();
        });
    });
    &lt;/script&gt;

&lt;input type="button" value="hide" id="hide"&gt;
&lt;div  id="cont"&gt;
text here...
&lt;/div&gt;
</code></pre>

<p>but it doesn't work, becouse it automaticaly sets <code>display:block</code> to <code>#cont</code> element, so after animation it starts to show.
when i try to set <code>display:none</code> to <code>#cont</code> element, it doesn't happen.
could you help me? thanks</p>
