《jQuery网页特效任务驱动式教程(微课版)-教案任务2 制作漂浮的广告.docx》由会员分享,可在线阅读,更多相关《jQuery网页特效任务驱动式教程(微课版)-教案任务2 制作漂浮的广告.docx(3页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、任务27制作漂浮的广告(2次课)课程内容信息说明主题制作漂浮广告所属任务任务2教学目标知识目标掌握实现漂浮广告时的方法和思路 掌握对漂浮广告进行控制的做法 掌握jQuery中的css()方法能力目标能够根据要求完成漂浮广告的设计,能够使用css()方法设置 或者获取元素的样式属性取值。重点漂浮广告实现原理 jQuery中的css()方法难点漂浮广告实现原理jQuery中使用css()方法设置元素样式属性取值时,样式属性的不同写法教学方法与教学手段教学方法线上线下结合、工程驱动、启发引导、问题导向、案例演示教学手段信息化手段应用,机房传屏软件应用或腾讯会议应用课中活动及需要时间1 .基于fixe
2、d定位的兀素的漂浮效果设计(65分钟)(1)广告移动方向说明(2)使用JavaScript代码定义move()函数实现元素的漂浮功能(3)使用setlnterval()调用函数move。时的考前须知(4)关于全局变量gox和goy的问题(5)使用jQuery代码实现漂浮广告功能2 .jQuery中的css()方法(45分钟)(1)使用css()方法返回元素的样式属性取值2 2) css(width)与 width。的比照(3)使用css()方法设置元素样式属性值3 .为漂浮广告增加控制功能(50分钟)(1)关闭按钮的添加(2)设置广告停止移动(3)单击关闭按钮隐藏漂浮广告4 .小测试(15分钟)(1)学生完成完成在教学平台中设计的在线测试(填空、选择和判断)(2)教师讲解小测试课堂小结(5分钟)对学生课前预习效果、本次课的实施效果进行点评,并提出新的要求课后活动学生活动(约30分钟)教师活动作业:检查作业,并将作业问按照要求完善漂浮广告小案例,并提交作业题反应给学生