jquery这个怎么实现？

一个按钮，点击按钮会在按钮下面滑出一个可关闭信息框（可以是table，也可以是图片），同时按钮消失；

点击信息框上面的关闭按钮，信息框关闭，按钮出现。

我是一个菜鸟，刚开始学习这个，麻烦会的大哥大姐们看看啊，谢谢了

[code="java"]









<br><br> $(function(){<br> $(&quot;#ok&quot;).click(function(){<br> $(&#39;#show&#39;).slideDown(&quot;slow&quot;);<br> });<br> });<br><br> function closeTag(){<br> $(&#39;#show&#39;).slideUp(&quot;slow&quot;);<br> }<br>

<body>  
    <div style="width:800px;height:30px;background:#EFECEF;padding:2px 0px 2px 20px;">
        <input id="ok" type="button" value="展  开" />
    </div>
   <div id="show" style="display:none;">
        <div style="width:800px;background:#ccc;">
            <div style="float:left;">这是弹出层</div>
            <div style="float:right;width:20px;">
                <input type="button" value="X" onclick="closeTag();" />
            </div>
        </div>
   </div>  
</body>


[/code]

[code="java"]









<br><br> $(function(){<br> $(&quot;#ok&quot;).click(function(){<br> var html = &#39;<div style="width:200px;height:100px;background:red;">这是弹出层</div>&#39;;<br> $(&#39;#show&#39;).append(html);<br> $(&#39;#show&#39;).fadeIn(&quot;slow&quot;);<br> });</p> <pre><code> $(&quot;#cancel&quot;).click(function(){ $(&#39;#show&#39;).fadeOut(&quot;slow&quot;); }); }); &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;div&gt; &lt;input id=&quot;ok&quot; type=&quot;button&quot; value=&quot;确定&quot; /&gt; &lt;input id=&quot;cancel&quot; type=&quot;button&quot; value=&quot;取消&quot; /&gt; &lt;/div&gt; &lt;div id=&quot;show&quot; style=&quot;display:none;&quot;&gt; &lt;/div&gt; &lt;/body&gt; </code></pre> <p></html><br> [/code]</p>

$(function(){
$("#ok").click(function(){
$('#show').slideDown("slow");
});

$("#cancel").click(function(){
          $('#show').slideUp("slow");
}); 
    $("#cccc").click(function(){
        $('#show').slideToggle("slow");
});

</script>  

<body>  
    <div>
        <input id="ok" type="button" value="确定" />
        <input id="cancel" type="button" value="取消" />
                    <input id="cccc" type="button" value="点击" />
    </div>
   <div id="show" style="display:none;">  
     <p>aaaaaaaaaaaa</p>
     <p>bbbbbbbbbbbbb</p>
   </div>  
</body>

[code="java"]$(function(){
$("#ok").click(function(){
$('#show').slideDown("slow");
});

$("#cancel").click(function(){
$('#show').slideUp("slow");
});
$("#cccc").click(function(){
$('#show').slideToggle("slow");
});



aaaaaaaaaaaa


bbbbbbbbbbbbb


[/code]

可以的

把table放在单独的div里，然后slideUp slideDown或者fadeIn

[code="java"]



(展开这部分头部)


(排序，表格这部分)

[/code]

[quote]滑出一个可关闭信息框，同时按钮消失；[/quote]
这个只要给按钮这部分头部也定一个id，slideUp或者fadeOut就好了，或者直接给按钮加个id，hide()和show()就好了