内容正文:
用案日期:________年______月_______日 星期_______ 主备人: 课时:N0:_____
教学课题
5.1认识动态网页
教学目标
认识动态HTML,了解动态网页的概念
能够实现简单的动态HTML效果,能够插入简单的javascript代码
掌握动态网页的特性
教学重难点
动态网页的概念
动态特效的实现
教学方法
讲授法、任务驱动法、演示法
教具
课件、素材网页
教学过程
个案补充
(1) 动态HTML的概念
1、情景创设
教师:展示做好的网页,网页中有许多动态HTML的效果,
问:请观察以下网页,注意哪些地方发生了动态的变化?
学生:仔细观察,发现有文字移动,背景颜色随鼠标变化等特效,兴趣大增。
教师引导:同学们想不想学呢,这是什么技术呢?
2、动态HTML的概念
动态HTML是一组技术集合,动态HTML能独立在客户端(浏览者自己的计算机上)处理页面元素,改变其版面、内容和位置,并把结果不断提供给网页浏览者,这些操作都是在客户端完成的,不需要向服务器请求让服务器来处理。这意味着动态HTML的Web页面里面含有程序,会对用户的操作有响应,使其产生动态效果,从而使网页表达能力更加的丰富,即动态HTML能自动变化,是丰富页面的重要手段。我们常用来实现动态HTML的技术有客户端标记语言JScript和VBScript、Document Object Model (简称DOM,文件目标模块),Layers和Cascading Style Sheets ( CSS样式表)等。
3.动态HTML常见实现方法
要实现动态HTML,可以利用很多现有的网页制作工具和专业的动态效果代码生成软件进行设计,比如FrontPage中的工具栏、Sothink Tree Menu等,这种方法的优势是实现起来比较简单,对制作者的计算机语言知识要求不高。也可以使用网络中下载的JavaScript和VBScript编写的现成脚本来实现一定的动态HTML效果。
4、教师演示:
例1:实现简单的动态HTML效果
演示:鼠标特效
方法:格式----动态HTML
学生探索练习并示范操作并讲解
5、学生练习
练习一:实现简单的动态HTML效果
(1).网页加载效果
(2).鼠标悬停效果(提供背景图片)
(3).单击
(4).双击
(2) 动态网页
1.