《jQuery网页特效任务驱动式教程(微课版)-教案任务5-2 淡入淡出和上卷下拉动画.docx》由会员分享,可在线阅读,更多相关《jQuery网页特效任务驱动式教程(微课版)-教案任务5-2 淡入淡出和上卷下拉动画.docx(2页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、任务5-2淡入淡出和上卷下拉动画(2次课)课程内容信息说明主题淡入淡出和上卷下拉动画所属任务任务5教学目标知识目标掌握淡入淡出动画函数的用法 掌握上卷下拉动画函数的用法能力目标能够熟练使用淡入淡出动画和上卷下拉动画函数实现动画效 果重点淡入淡出动画函数 上卷下拉动画函数难点使用上卷下拉动画实现阶梯式的动画效果 淡入淡出函数中fadeTo()中透明度的问题教学方法与教学手段教学方法线上线下结合、工程驱动、启发引导、问题导向、案例演示教学手段信息化手段应用,机房传屏软件应用或腾讯会议应用课中活动及需要时间1 .淡入淡出动画函数(35分钟)(1) 4 个函数的格式和用法:fadeln() fadeO
2、ut() fadeToggle() fadeTo()(2)使用4个函数实现简单的淡入淡出动画,重点演示fadeTo()透明度对fadeln()和fadeOut。 透明度的影响。2 .上卷下拉动画函数(55分钟)(1) 3 个函数的格式和用法:slideDown() slideUp() slideToggle()(2)使用上卷下拉函数实现百叶窗效果(3)使用上卷下拉函数实现折叠框动画3 .阶梯式的上卷下拉动画(85分钟)(1)阶梯式上卷下拉动画的效果演示及任务描述(2) jQuery中的队列控制方法(3)使用队列控制方法实现阶梯式的上卷下拉动画课堂小结(5分钟)对学生课前预习效果、本次课的实施效果进行点评,并提出新的要求课后活动学生活动(约30分钟)教师活动作业:检查作业,并将作业问完善阶梯式的上卷下拉动画效果,改写程序。题反应给学生