这里就通过一个折叠菜单的实现，记录一下几种常用的动画效果。
HTML代码：
菜单折叠及展开时的效果：
其实，除了以上两个例子中突然改变元素的可见性外。还可以设定speed参数，控制改变的速度，该参数可以为毫秒数或者指定字符slow,normal,fast。
1.首先直接使用Show()和Hide方法来实现。
这个功能主要的几点：①实现子菜单的隐藏和显示控制；②改变父级菜单的+-号；③改变鼠标经过时指针形状。
$(document).ready(function(){//加载时隐藏子菜单$('liul').hide();//不包含子菜单时鼠标指针和项目图标$('li:not(:has(ul))').css({'cursor':'default','list-style-image':'none'});//包含子菜单时鼠标指针和项目图标$('li:has(ul)').css({'cursor':'pointer','list-style-image':'url(plus.gif)'});//单击含子菜单的项$('li:has(ul)').click(function(event){if(this==event.target){if($(this).children().is(':hidden')){$(this).css('list-style-image','url(minus.gif)').children().show();}else{$(this).css('list-style-image','url(plus.gif)').children().hide();}}})})2.更简单的切换--toggle()方法
//单击含子菜单的项$('li:has(ul)').click(function(event){if(this==event.target){$(this).css('list-style-image',($(this).children().is(':hidden')'url(minus.gif)':'url(plus.gif)'));$(this).children().toggle();}})
3.给切换来个限速，设置speed参数。
将方案一略作修改：
经过测试，FadeTo(‘slow’)和FadeTo(‘slow’,0)两个方法还是有区别的。FadeTo方法可以将元素的不透明度设置为0，但是元素所占的位置不会从屏幕上消失。