3应用动态HTML【学习目标】知识与技能:在网页中加入JavaScript特效;了解动态HTML设计原则
过程与方法:通过自主探究,让学生掌握在网页中插入JavaScript特效的方法
情感态度价值观:合理地借鉴他人动态HTML技术,体验代码复用技术的优越性
教学重点、难点重点:JavaScript特效在网页中的实现难点:如何简单修改JavaScript代码课时安排1-2课时教学设计课前延伸学生欣赏课本配套光盘上特效实例,并根据效果进行归类
【课前热身】:学生进行特效整理归类
课内探究上节的学习中,我们了解了JavaScript能实现日期时间、旋转文字的特效制作,我们再来观看一些图片、窗口页面、鼠标、状态栏等特效设置
请根据自己的喜好选择一些动态效果(《HTML素材》)运用到网页中,增加Web界面的生动性、“智能性”
为了方便大家学习在网页中使用JavaScript特效,我们收集了许多JavaScript特效实现的代码,准备做一个相关的专题网站
为了便于大家查找,请你从HTML素材找出其对应的效果网页帮他归归类(学生可分组完成),将特效类型拖至相应的文件夹中
你了解哪些网页特效:
【实践一】:编辑“HTML素材”文件夹下的js
htm,将alert(“欢迎进入JS学习网页
”)这段JavaScript代码插入到HTML代码的body区域中,并保存并预览效果
Javascript脚本语言书写具有其基本结构,我们有必要来回味一下:中间添入脚本代码例如:alert("")是弹出一个对话框的语名window
open("网页文件名","","height=数字,width=数字")是弹出一、创设情境,明确任务(点击进入素材目录)先展示《HTML素材》中的一些特效网页,让学生回顾一下Javascript脚本语言书写的基本结构,为本节的学习做好铺垫
【思考】:以上这些特效,我们如何