ช่วยทีคับ การแสดง ข้อความ ค่อยๆแสดง จากด้านบนไล่ลงล่าง

[wasantec]

<div style="display: none;" id="hide">

ข้อความทดสอบ

<a href="javascript:void(0)" onclick="document.getElementById('hide').style.display = 'none';document.getElementById('show').style.display = 'block'; return false;">[ hide ]</a>
</div>
<a href="javascript:void(0)" onclick="document.getElementById('hide').style.display = 'block'; document.getElementById('show').style.display = 'none'; return false;" id="show" style="display: block;">[ show ]</a>


จากโค๊ด จะเป็นโค๊ดที่ คลิกปุ่ม show จะแสดง ข้อความ "ข้อความทดสอบ" คืออยากให้ตอนโชว์  ให้มันค่อยๆแสดง จากด้านบนไล่ลงล่าง ต้องเพิ่มโค๊ดแบบไหน คับ จากตัวอย่าง มันจะ แสดงขึ้นมาเลย