版权声明：程序猴jwang版权所有 https://blog.csdn.net/qq_21046965/article/details/84439749
前言
本章概要的讲解一下JQuery的动画效果
方法
本章的实例代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>JQuery</title>
<script src="js/jquery-3.3.1.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
</script>
</head>
<body>
<div>
<form action="#" method="post" id="ff">
<h5>注册信息</h5>
用户名：<input type="text" name="username" id="username" value="张三"/><span id="usernameSpan"></span><br/>
性 别：<input type="radio" name="sex" value="男" checked="checked"/>男<input type="radio" name="sex" value="女"/>女<span></span><br/>
爱 好:<input type="checkbox" name="hobby" value="足球" />足球<input type="checkbox" name="hobby" value="游泳"/>游泳
<input type="checkbox" name="hobby" value="棋牌" />棋牌<span></span><br/>
毕业院校：<select name="school" id="school" class="sd">
<option value="--请选择--">--请选择--</option>
<option value="清华大学">清华大学</option>
<option value="北京大学">北京大学</option>
<option value="挖掘机技术学院">挖掘机技术学院</option>
</select><span></span><br/>
个人简介：<textarea rows="3" cols="20" name="introduce" id="introduce"></textarea><span></span><br/>
<input id="sub" type="button" value="提交"/> <input type="reset" name="" id="" value="重置" />
</form>
</div>
</body>
</html>1.使用jquery实现显示与隐藏
语法1：元素对象.show()：显示该元素对象
语法2：元素对象.hide()：隐藏该元素对象
实例：将提交按钮绑定单击事件，点击效果为将h5标签进行隐藏
$(function(){
$("body").on("click","#sub",function(){
$("h5").hide();
});
});大家目前主要记住这个方法就可以了，动画效果我们这里知道就行
附录：JQuery动画效果方法大全
| 方法 | 描述 |
|---|---|
| animate() | 对被选元素应用"自定义"的动画 |
| clearQueue() | 对被选元素移除所有排队函数（仍未运行的） |
| delay() | 对被选元素的所有排队函数（仍未运行）设置延迟 |
| dequeue() | 移除下一个排队函数，然后执行函数 |
| fadeIn() | 逐渐改变被选元素的不透明度，从隐藏到可见 |
| fadeOut() | 逐渐改变被选元素的不透明度，从可见到隐藏 |
| fadeTo() | 把被选元素逐渐改变至给定的不透明度 |
| fadeToggle() | 在 fadeIn() 和 fadeOut() 方法之间进行切换 |
| finish() | 对被选元素停止、移除并完成所有排队动画 |
| hide() | 隐藏被选元素 |
| queue() | 显示被选元素的排队函数 |
| show() | 显示被选元素 |
| slideDown() | 通过调整高度来滑动显示被选元素 |
| slideToggle() | slideUp() 和 slideDown() 方法之间的切换 |
| slideUp() | 通过调整高度来滑动隐藏被选元素 |
| stop() | 停止被选元素上当前正在运行的动画 |
| toggle() | hide() 和 show() 方法之间的切换 |