刘杰给老师的讲课稿.docVIP

制作动态网页（初中信息技术八年级模块四第四节） 信息技术教案内容1．教学设计学科名称2．所在班级情况，学生特点分析3．教学内容分析4．教学目标5．教学难点分析6．教学课时7．教学过程8．课堂练习9．作业安排10． 附录（教学资料及资源）11． 自我问答 第节 制作动态网页 ? 教学目的： ⒈； ⒉掌握滚动字幕的制作； ⒊学会按钮； ⒋； ⒌学会； ⒍网页。 ? 重点难点： W和动态HTML效果的制作。 ? 教学方法： 讲解、演示和学生上机操作 课时： ??? 3课时 教学步骤： 〈导入新课〉 同学们，我们已经学会了用FrontPage200制作网页的一些基本的操作，我们的网页更漂亮在网上我们看到很多网页上的元素都能动起来那么我们是不是也想让我们的网页动起来呢？下面我们就来学习动态网页的制作。 〈板书〉????????????????? 第节 制作动态网页 我们看到，许多网站都有，其实它的制作并不复杂。现在我们来为我们的“环保”网站〈板书〉一、[演示] huanbao网站中，“jiayuan.htm”的框架页面，将两幅标题的图片轮流显示在页面上。 图4-4-1 在预定时间内出现的画面 图 4-4-2 在限定日期前后出现的画面 操作步骤： (1)?单击“插入” 菜单中的“组件”“插入web组件”的对话框。 图 4-4-3 (2)在“插入web组件”的对话框中“组件类型”中选择“包含内容”，在“选择内容类型”中选择“预定图片”?。 (3)?。 ??图(4) 在“预定图片属性”对话框中，通过“浏览”确定“在预定的时间内”显示的图片及“在预定的时间之前和之后”显示的图片?。 (5)?(6)单击“确定”按钮。? 这样，我们的“”就做好了。 下面我们来创建滚动的文字字幕。 〈板书〉 二、滚动字幕 [演示] 在主页的标题图片下面插入滚动字幕，文本内容为“让地球更绿，让我们的家园更美好”。 操作步骤： （1）插入点，“插入”对话框的“组件“组件类型”中选择“动态效果”，“字幕属性”对话框。 图4-4-5 （）在“文本”中输入字幕内容。方向设置为“左”速度“延迟”用来设置字幕每次移动的时间间隔，该参数越大，字幕移动越慢；“数量”用来定义字幕每次移动的距离，该参数越大，字幕移动越快我们使用默认值。“表现方式”“滚动条”可以让文字沿设置的方向，从字幕区域的一边出现，到另一边消失。“幻灯片”可以让文字沿设置的方向，从字幕区域的一边出现，当文字到达字幕区域的另一边时停止滚动并保持在屏幕上。“交替” 可以让文字在字幕区域来回移动。我们把“表现方式”设置为“滚动条”。 区域设置字幕的大小。，其余采用默认值。 （）单击“确定”按钮。 我们切换到“预览”来看一下其效果。下面我们来。 〈板书〉 三、 图4-4-6 交互式按钮 （1）把插入点定位于插入交互式按钮位置，在“插入web组件”对话框的“组件类型”中选择“动态效果”，在“选择一种效果中”选择“交互式按钮”。 （2）单击“完成”按钮，弹出如图4-4-7所示“交互式按钮”对话框。 图 4-4-7 （3）在“按钮”选项卡上的“文本”栏输入按钮文字“环境保护”，按钮类型选择“浮雕标签1”，在“链接”栏指定链接网页文件名“hj-1.htm”。 （4）在“字体”选项卡中，设置按钮文字的字体为宋体，字形为常规，我们切换到“预览”来看一下其效果。〈板书〉四、动态HTML效果HTML（DHTML）又称动态超文本标识语言，它是Microsoft公司对HTML4.0的增强，使用它可以在网页中产生动画效果，即设置一个触发事件。FrontPage 2003中的触发事件有单击、双击、鼠标悬停、网页加载等。用户可以根据自己的需要设置相应的动画效果。我们在.htm网页的下框中输入有关地球日的资料，将其定义为在网页加载时“”“飞入”页面的动态效果。 [演示] 操作步骤： (1)?将的，选定上述文字，然后单击“”菜单中的“”，选中“DHTML效果”，弹出“DHTML效果”工具栏。 (2)?在“动态HTML效果”工具栏。 图4-4-8 （3）在对话框中选择放大后的字体、字号和颜色等，单击“确定”按钮。 接下来我们来学习“动态HTML效果”的制作。 〈板书〉 五、动态HTML效果操作步骤： (1)???然后单击“”菜单中的“”，选中“DHTML效果”，弹出“DHTML效果”工具栏。 (2)?如图4-4-9所示，选择 “单击