javascript - 我如何在这里添加动画功能

Question

我试图在用户单击“显示更多”按钮时显示一些 div 内容，然后在用户单击“隐藏”按钮时隐藏 div 内容，我想用一些动画来实现此功能。这是我的脚本:

$(document).ready(function(){  //Toggling between more results
    $('.loadMoreDiv').click(function(){  
        $('#loadMoreDiv').hide();  
        $('#hideMoreDiv').show();  
        $('.old_message_block').removeClass('inactive').addClass('active');  
        $('#messagesLabel').text('showing all messages');  
    });  
    $('.lessMoreDiv').click(function(){  
        $('#hideMoreDiv').hide();  
        $('#loadMoreDiv').show();  
        $('.old_message_block').removeClass('active').addClass('inactive');  
        $('#messagesLabel').text('Most Recent message');  
    });  
});  

我的jsfiddle是here

Answer 1

快速修复:http://jsfiddle.net/sureshpattu/JkuW3/1/

但无论如何我都会写出完全不同的东西:

http://jsfiddle.net/UPWpB/1/