มาต่อจากบทความ พื้นฐานการเขียน JQUERY PART1 มาเพิ่มการประยุคใช้เพิ่มกันต่อ

Effects
Fading Out and In : $(selector).fadeOut() และ$(selector).fadeIn()
Sliding Up and Down : $(selector).slideUp() และ$(selector).slideDown()
Sliding Toggle : $(selector).slideToggle()
Custom animation effect : $(selector).animate()
การใช้ Fading Effect
ตัวอย่างนี้จะเป็นเกี่ยวกันการแสดงบทความแบบ สไลน์
ตัวอย่าง
http://pramooleasy.com/pgm-lesson/welcome5.php/ 
<script type="text/javascript">
$(function()
{
$('.fadeOut_box').click(function()
{
$('#box').fadeOut("slow");
//Sliding effect just replace fadeOut() to slideUp()
});
$('.fadeIn_box').click(function()
{
$('#box').fadeIn("slow");
//Sliding effect just replace fadeIn() to slideDown()
});
});
</script>
<body>
<a href="#" class="fadeOut_box">fadeOut()</a>
<a href="#" class="fadeIn_box">fadeIn()</a>
<div id="box"></div>
</body>
CSS code
#box
{
background-color:#96BC43;
border:solid 3px #333333;
height:160px;
margin-top:30px;
}
credit
http://pgm-lesson.blogspot.com/ 