JQuery中淡出和淡入动画效果

开发工具与关键技术： MVC
班级：18级（4）班
撰写时间：2019.5.20

JQuery中淡出动画fadeOut让元素在页面不可见，常用的办法就是通过设置样式的display:none。除此之外还可以一些类似的办法可以达到这个目的。这里要提一个透明度的方法，设置元素透明度为0，可以让元素不可见，透明度的参数是0~1之间的值，通过改变这个值可以让元素有一个透明度的效果。常见的淡入淡出动画正是这样的原理。
fadeOut()函数用于隐藏所有匹配的元素，并带有淡出的过渡动画效果。
所谓"淡出"隐藏的，元素是隐藏状态不对作任何改变，元素是可见的，则将其隐藏。
fadeOut([speed],[easing],[fn])。
参数说明：
speed:三种预定速度之一的字符串(“slow”,“normal”,
or “fast”)或表示动画时长的毫秒数值(如：1000)。
easing:(Optional)
用来指定切换效果，默认是"swing"，可用参数"linear"。
fn:在动画完成时执行的函数，每个元素执行一次。

显示按钮的点击事件

btnFadeOut按钮的点击事件

效果图下图所示：

JQuery中淡入动画fadeIn跟淡出动画的用法是一样。
点击隐藏按钮的点击事件：

BtnFadeIn按钮的点击事件

效果图下图所示：