1.show()和hide()和toggle()(这是show和hide的一个综合，一个按钮就实现显示和隐藏)
效果：
代码：
<button type="button" class="show">普通show</button><button type="button" class="show1">一秒show</button><button type="button" class="hidden">普通hidden</button><button type="button" class="hidden1">一秒hidden</button><div id="box" style="width: 100px;height: 100px;background-color: red;"></div><script type="text/javascript"> ???$(".show").click(function () { ???????$("#box").show(); ???}) ???$(".show1").click(function () { ???????$("#box").show(1000); ???}) ???$(".hidden").click(function () { ???????$("#box").hide(); ???}) ???$(".hidden1").click(function () { ???????$("#box").hide(1000); ???})
//还可以添加slow（200）,fast（600）,normal（400）三个参数，默认是400毫秒</script>实现列队动画：
效果：
代码：
<style> ???div{ ???????background: red; ???????color: #fff; ???????margin-left: 5px; ???????float: left; ???????display: none; ???}</style><div>你</div><div>好</div><div>吗</div><div>？</div><button type="button" class="show">显示列队动画</button><button type="button" class="hide">隐藏列队动画</button><script type="text/javascript"> ???$(".show").click(function () { ???????//列队动画，递归自调用 ???????$("div").first().show("fast",function testShow() { ???????????$(this).next().show("fast",testShow); ???????}) ???}) ???$(".hide").click(function () { ???????//列队动画，递归自调用 ???????$("div").last().hide("fast",function testShow() { ???????????$(this).prev().hide("fast",testShow); ???????}) ???})</script>3.toggle()就是show和hide的综合
jquery 实现动画效果（各种方法）
原文地址：https://www.cnblogs.com/alex-xxc/p/10015416.html