《工信版（中职）Dreamweaver实例教程第9章教学课件.ppt》由会员分享，可在线阅读，更多相关《工信版（中职）Dreamweaver实例教程第9章教学课件.ppt（21页珍藏版）》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、YCF（中职）Dreamweaver实例教程第9章教学课件第九章网页特效 学习目标1）了解行为面板的基本功能。2）掌握常用行为的使用。9.1 行为面板基本功能 重点提示1）理解行为的作用。2）熟悉行为面板。行为是实现网页上交互的一种捷径，Dreamweaver 8.0 行为将 Javascript 代码放置在文档中，以允许访问者与 Web 页进行交互，从而以多种方式更改页面动作或执行某些任务。行为是事件和由该事件触发的动作的组合。事件是动作被触发的结果，而动作是用于完成特殊任务的预先编好的JavaScript代码，诸如打开一个浏览器窗口，播放声音等。当对一个页面元素使用行为时，需要用户指定动作
2、和所触发的事件。实例1 熟悉行为面板。9.2“改变属性”动作的应用 重点提示1）动态改变文字大小2）使用“改变属性”动作交换图片实例2 动态改变文字大小。鼠标移到这段文字上，文字将被放大，单击鼠标时，改变文字的背景色，鼠标移开，文字恢复原大小。实例3 变换图片。实现效果：当用户把鼠标移到图片上时，就换了一张图片；当把鼠标移开图片时，它又恢复了原来的图片。这种动态效果同样是用“行为”中的“改变属性”动作功能实现的。课堂练习利用表格做一个变色按钮，当鼠标移到按钮上时，按钮背景色变为红色#ff0000，当鼠标按下时，按钮背景色变为浅黄色#ffffcc，当鼠标离开按钮时，按钮背景色恢复为原来的淡蓝色#
3、ccccff，练习效果见下图。鼠标不在按钮上时 鼠标移到按钮上 鼠标按下时9.3 制作弹出窗口 重点提示掌握网页中弹出窗口的制作方法。实例4 载入网页时弹出窗口。课堂练习1使用超级链接控制弹出窗口。2图片控制弹出窗口练习。9.4 制作动态图片按钮 实例5 制作动态图片按钮。实例效果如下图所示。9.5 制作动态图片说明 重点提示掌握动态图片说明的制作方法。实例6 制作动态图片说明。当鼠标指向不同的图片上时显示一段关于相应图片的文字说明，实例效果下图A、B所示。图A鼠标不在图象上图B 鼠标移到图象上9.6 设置状态栏文本重点提示掌握状态栏文本的设置方法实例7 在状态栏显示普通文本的提示。当鼠标移到这段文本上时状态栏显示关于文本的信息，鼠标离开这段文本时，状态栏中的信息消失，实例效果如下图所示。9.7 播放声音 重点提示掌握如何为网页中添加声音。实例8 在普通文本上播放声音。实现的效果就是当浏览者的鼠标移到某段文本上就开始播放声音。本 章 小 结 本章详细地讲解了部分网页特效的制作方法和基本原理，包括制作动态图片按钮、制作弹出按钮、设置状态栏文本、播放声音等，从中读者可以学习到很多设计思想和创意。