2019最新人教版信息技术五下第14课《网页的动态效果》教案
合集下载
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
2、行为插件的制作
技能培训的目的
1、使制作的网页更加人性化，使网页能够动起来并且有良好的交互性
2、合理发掘利用Dreamweaver MX的功能
教法
演示与练习相结合、引发学生学习的兴趣、指导学生自学
学法
记忆、观察、思考与上机实践
教具使用
多媒体投影、多媒体计算机机房
教学内容与过程
教学内容
教师活动
学生活动
中部向上下展开RevealTrans16
阶梯状向左下展开RevealTrans17
阶梯状向左上展开RevealTrans18
阶梯状向右下展开RevealTrans19
阶梯状向右上展开RevealTrans20
随机水平线RevealTrans21
随机垂直线RevealTrans22
随机RevealTrans23
2．利用层和时间轴制作的动态效果
3．利用行为制作各类动态效果
4．学生上机操作，复习刚才所学的操作，同时复习和思考老师的问题。
给出本节课题
8.1用Dreamweaver MX制作动态效果
1．网页溶解的过渡效果
（1）单击菜单中的“插入”|“文件头标签”|“meta”命令
（2）设置“meta”对话框，在“属性”中选“HTTP-equivalent”选项，在“值”中键入“Page-Enter”，在“内容”中键入“Revealtrans(Duration=4,Transition=12)”
2019最新人教版信息技术五下第14课《网页的动态效果》教案
第8章网页动态效果的制作（网页制作中职教程何克抗）
节
8.1用Dreamweaver MX制作动态效果
教学目标
1、掌握利用META制作网页过渡效果
2、掌握利用层和时间线制作动态效果
3、掌握利用行为制作各类动态效果
教学重点、难点
1、层移动和时间线概念
弹出广告窗口效果：
（1）在站点下创建一个基本页面“window.html”
（2）打开网站“摄影天地”的首页，使用快捷键SБайду номын сангаасift+F3打开行为面板。
（3）在行为面板中点击添加行为按钮，选择“打开浏览器窗口”，在弹出的“打开浏览器窗口”对话框中进行适当设置
（4）选择页面的空白处，在行为面板中选择“Onload”事件
（2）执行菜单的“文件”|“保存”命令（或使用快捷键CTRL+S键）保存文件。
（3）用鼠标选中文字“首页”，打开行为面板，点击添加按钮，选择“显示弹出式菜单”命令。并设置对话框。
（4）保存文件，看预览效果
4．上机操作：
（1）继续上机操作老师演示的实例，并记录步骤
（2）建立课后作业题4.5
（3）思考问题：行为事件是怎么发生的？
备注
复习提问
提问：
1、简述色彩搭配的一般原则
2、网页中，是不是动态效果做的越多越好？
思考
回答问题
导入新课
1．用多媒体方法展示一个已完成的网站，包括网页动态效果META、层和时间线、行为等
2．启动DreamWeaverMX软件展示对这些动态效果的处理
引发学习兴趣
明确学习内容
讲授新课
1．利用META制作网页过渡效果
2019最新人教版信息技术五下第14网页动态效果的制作网页制作中职教程网页的动态效果教案dreamweavermx制作动态效果1掌握利用meta制作网页过渡效果教学目标2掌握利用层和时间线制作动态效果3掌握利用行为制作各类动态效果教学重1层移动和时间线概念点难点2行为插件的制作技能培训1使制作的网页更加人性化使网页能够动起来并且有良好的交互性的目的2合理发掘利用dreamweavermx的功能教法演示与练习相结合引发学生学习的兴趣指导学生自学学法记忆观察思考与上机实践教具使用多媒体投影多媒体计算机机房教学内容与过程教学内容教师活动学生活动复习提问提问
向右擦除RevealTrans7
垂直百页窗RevealTrans8
水平百页窗RevealTrans9
横向棋盘式RevealTrans10
纵向棋盘式RevealTrans11
溶解RevealTrans12
左右向中部收缩RevealTrans13
中部向左右展开RevealTrans14
上下向中部收缩RevealTrans15
理解记忆
观察操作过程
学习具体操作
观察操作过程
学习具体操作
观察操作过程
操作，并记录下来
思考
教师讲解时要尽量以实例讲解，使学生加深感性认识
教师讲解、启发
教师讲解时要尽量以实例讲解，使学生加深感性认识
要培养学生勤动脑动手的习惯
教师下台指导学生
也可以采用小组教学的方式，先小组内互帮互学，小组内不能解决的请教老师
2．层移动效果
（1）执行菜单栏的“窗口”|“其他”|“时间轴”命令
（2）执行菜单的“插入”|“层”命令
（3）光标定位到新建的图层中，执行菜单的“插入”|“图像”命令插入图像
（4）用鼠标左键拖动信封图层放到时间轴面板的第1层
（5）选中了第1层中第1帧，此时将信封移到整个窗口的左上角，选中第1层中的第15帧，将信封移动到右边
Transition的值及具体效果和设置如下所示
效果ContentTransitionv
盒状收缩RevealTrans0
盒状展开RevealTrans1
圆形收缩RevealTrans2
圆形展开RevealTrans3
向上擦除RevealTrans4
向下擦除RevealTrans5
向左擦除RevealTrans6
小结
1．用META制作网页过渡效果
2．用层和时间线制作动态效果
3．用行为制作各类动态效果
作业
1．书P256：1.1、1.2、1.3、1.4、1.5、2.1、2.2、2.3、2.7、3.3、3.4、4.1、4.2、4.3、4.4、4.5
2．温习所掌握的操作
3．预习下一节内容
检查插件效果（以Flash插件为例）：
（1）准备两个页面，一个是支持你插件的页面，另一个是不支持插件的页面。
（2）点击行为面板的按钮，选择“检查插件”命令。
（3）设置“检查插件”窗口为Flash插件
（4）点击确定按钮，在行为面板中选择“OnLoad”事件
导航下拉菜单的制作：
（1）输入文字“首页”，给文字添加链接
（6）用鼠标拖动第一层的第15帧到第50帧，用以延长动画的时间
（7）重复操作可以添加其他动画
3．利用行为制作各类动态效果
弹出消息框效果：
（1）执行菜单的“窗口”|“行为”命令
（2）鼠标选中主页的横幅图片
（3）行为面板上单击添加行为按钮，选择“弹出信息”命令，在弹出的“弹出信息”对话框中输入信息
（4）在行为面板中点击事件的向下箭头，选择“OnCopy”事件
技能培训的目的
1、使制作的网页更加人性化，使网页能够动起来并且有良好的交互性
2、合理发掘利用Dreamweaver MX的功能
教法
演示与练习相结合、引发学生学习的兴趣、指导学生自学
学法
记忆、观察、思考与上机实践
教具使用
多媒体投影、多媒体计算机机房
教学内容与过程
教学内容
教师活动
学生活动
中部向上下展开RevealTrans16
阶梯状向左下展开RevealTrans17
阶梯状向左上展开RevealTrans18
阶梯状向右下展开RevealTrans19
阶梯状向右上展开RevealTrans20
随机水平线RevealTrans21
随机垂直线RevealTrans22
随机RevealTrans23
2．利用层和时间轴制作的动态效果
3．利用行为制作各类动态效果
4．学生上机操作，复习刚才所学的操作，同时复习和思考老师的问题。
给出本节课题
8.1用Dreamweaver MX制作动态效果
1．网页溶解的过渡效果
（1）单击菜单中的“插入”|“文件头标签”|“meta”命令
（2）设置“meta”对话框，在“属性”中选“HTTP-equivalent”选项，在“值”中键入“Page-Enter”，在“内容”中键入“Revealtrans(Duration=4,Transition=12)”
2019最新人教版信息技术五下第14课《网页的动态效果》教案
第8章网页动态效果的制作（网页制作中职教程何克抗）
节
8.1用Dreamweaver MX制作动态效果
教学目标
1、掌握利用META制作网页过渡效果
2、掌握利用层和时间线制作动态效果
3、掌握利用行为制作各类动态效果
教学重点、难点
1、层移动和时间线概念
弹出广告窗口效果：
（1）在站点下创建一个基本页面“window.html”
（2）打开网站“摄影天地”的首页，使用快捷键SБайду номын сангаасift+F3打开行为面板。
（3）在行为面板中点击添加行为按钮，选择“打开浏览器窗口”，在弹出的“打开浏览器窗口”对话框中进行适当设置
（4）选择页面的空白处，在行为面板中选择“Onload”事件
（2）执行菜单的“文件”|“保存”命令（或使用快捷键CTRL+S键）保存文件。
（3）用鼠标选中文字“首页”，打开行为面板，点击添加按钮，选择“显示弹出式菜单”命令。并设置对话框。
（4）保存文件，看预览效果
4．上机操作：
（1）继续上机操作老师演示的实例，并记录步骤
（2）建立课后作业题4.5
（3）思考问题：行为事件是怎么发生的？
备注
复习提问
提问：
1、简述色彩搭配的一般原则
2、网页中，是不是动态效果做的越多越好？
思考
回答问题
导入新课
1．用多媒体方法展示一个已完成的网站，包括网页动态效果META、层和时间线、行为等
2．启动DreamWeaverMX软件展示对这些动态效果的处理
引发学习兴趣
明确学习内容
讲授新课
1．利用META制作网页过渡效果
2019最新人教版信息技术五下第14网页动态效果的制作网页制作中职教程网页的动态效果教案dreamweavermx制作动态效果1掌握利用meta制作网页过渡效果教学目标2掌握利用层和时间线制作动态效果3掌握利用行为制作各类动态效果教学重1层移动和时间线概念点难点2行为插件的制作技能培训1使制作的网页更加人性化使网页能够动起来并且有良好的交互性的目的2合理发掘利用dreamweavermx的功能教法演示与练习相结合引发学生学习的兴趣指导学生自学学法记忆观察思考与上机实践教具使用多媒体投影多媒体计算机机房教学内容与过程教学内容教师活动学生活动复习提问提问
向右擦除RevealTrans7
垂直百页窗RevealTrans8
水平百页窗RevealTrans9
横向棋盘式RevealTrans10
纵向棋盘式RevealTrans11
溶解RevealTrans12
左右向中部收缩RevealTrans13
中部向左右展开RevealTrans14
上下向中部收缩RevealTrans15
理解记忆
观察操作过程
学习具体操作
观察操作过程
学习具体操作
观察操作过程
操作，并记录下来
思考
教师讲解时要尽量以实例讲解，使学生加深感性认识
教师讲解、启发
教师讲解时要尽量以实例讲解，使学生加深感性认识
要培养学生勤动脑动手的习惯
教师下台指导学生
也可以采用小组教学的方式，先小组内互帮互学，小组内不能解决的请教老师
2．层移动效果
（1）执行菜单栏的“窗口”|“其他”|“时间轴”命令
（2）执行菜单的“插入”|“层”命令
（3）光标定位到新建的图层中，执行菜单的“插入”|“图像”命令插入图像
（4）用鼠标左键拖动信封图层放到时间轴面板的第1层
（5）选中了第1层中第1帧，此时将信封移到整个窗口的左上角，选中第1层中的第15帧，将信封移动到右边
Transition的值及具体效果和设置如下所示
效果ContentTransitionv
盒状收缩RevealTrans0
盒状展开RevealTrans1
圆形收缩RevealTrans2
圆形展开RevealTrans3
向上擦除RevealTrans4
向下擦除RevealTrans5
向左擦除RevealTrans6
小结
1．用META制作网页过渡效果
2．用层和时间线制作动态效果
3．用行为制作各类动态效果
作业
1．书P256：1.1、1.2、1.3、1.4、1.5、2.1、2.2、2.3、2.7、3.3、3.4、4.1、4.2、4.3、4.4、4.5
2．温习所掌握的操作
3．预习下一节内容
检查插件效果（以Flash插件为例）：
（1）准备两个页面，一个是支持你插件的页面，另一个是不支持插件的页面。
（2）点击行为面板的按钮，选择“检查插件”命令。
（3）设置“检查插件”窗口为Flash插件
（4）点击确定按钮，在行为面板中选择“OnLoad”事件
导航下拉菜单的制作：
（1）输入文字“首页”，给文字添加链接
（6）用鼠标拖动第一层的第15帧到第50帧，用以延长动画的时间
（7）重复操作可以添加其他动画
3．利用行为制作各类动态效果
弹出消息框效果：
（1）执行菜单的“窗口”|“行为”命令
（2）鼠标选中主页的横幅图片
（3）行为面板上单击添加行为按钮，选择“弹出信息”命令，在弹出的“弹出信息”对话框中输入信息
（4）在行为面板中点击事件的向下箭头，选择“OnCopy”事件