jQuery中窗帘动画
开发工具与关键技术：前端
作者：黄志鹏
撰写时间：2019/1/19
在jQuery中自定义了很多动画，下面我们来做一个上下拉动的窗帘动画。
首先我们先弄一个大盒子，只设置宽高和边框即可，
在大盒子这个类里面呢，我们添加一个div子元素，
设置其宽高和背景颜色，
这个子元素呢也就是窗帘的宽高和背景颜色了，这时我们要让其隐藏。
在大盒子这个类里面我们再添加三个按钮。分别是下拉按钮，上卷按钮和上下切换按钮。
样式布局代码如下
浏览器输出结果为
要让窗帘下拉是通过slideDown（）方法实现的，而上卷是通过slideUp（）方法实现的
下面是实现这两个方法的代码截图
浏览器输出结果
slideDown与slideUp是一对相反的方法。需要对元素进行上下拉卷效果的切换，jQuery提供了一个便捷方法slideToggle用滑动动画显示或隐藏一个匹配元素
下面是slideToggle（）方法的代码截图