电子教案-《Dreamweaver网页设计与制作(第二版)》-A06-3954(示例)项目三

【任务实施】 在学习了图像的应用后，请同学们动手在“福特汽车”网站主页中插入图像和导航条。 【任务三】为主页设置动画和背景音乐——应用动画和多媒体 （一）插入 Flash动画 Flash动画是目前最流行的矢量动画，它具有文件尺寸小、变化丰富的优点，因而很多网页中都会使用。 步骤 1 与插入图像的方法类似，在网页中插入Flash动画的方法也非常简单。确定插入点后，单击“常用”插入栏中的“媒体”→“Flash”按钮。 步骤 2 弹出“选择文件”对话框，在“查找范围”下拉列表中选择动画所在文件夹，在文件夹列表中选择一个扩展名为“.swf”的 Flash 动画。 步骤 3 单击“确定”按钮，弹出“对象标签辅助功能属性”对话框，再次单击“确定”按钮，Flash 动画就插入到网页中了。 步骤 4 单击选中网页中的Flash动画，可以在“属性”面板中对该动画的各项属性进行修改。 “属性”面板中部分常用设置项的意义如下。 ? 循环：选中该选项后，Flash 动画将连续播放。如果没有选中该选项，则 Flash 动画在播放一次后停止播放。 ? 自动播放：如果选中该选项，则在打开页面时自动播放 Flash 动画。 ? 垂直边距和水平边距：指定 Flash 动画周围的空白像素值。 ? 宽和高：以像素为单位指定 Flash 动画的宽度和高度。 ? 文件：指向 Flash 动画文件的路径。 ? 重设大小：将 Flash 动画恢复到实际大小。 ? 品质：设置 Flash 动画的播放品质。 ? 比例：确定Flash动画如何适应在其“宽”和“高”编辑框中设置的尺寸。缺省为“默认（全部显示）”，表示显示整个Flash动画；“无边框”表示使影片适合设定的尺寸，维持原始的纵横比；“严格匹配”表示对影片进行缩放以适合设定的尺寸，忽略纵横比。 ? 对齐：确定影片在页面上的对齐方式。 ? 背景颜色：指定Flash动画区域的背景颜色。在不播放Flash动画时（在加载时和播放后）也显示此颜色。 ? 参数：单击此按钮打开一个对话框，可在其中输入传递给 Flash 动画的附加参数。 （二）应用透明 Flash动画 假如已为网页、某个表格或某个单元格设置了一张背景图像，当在单元格中插入一个Flash动画的时候，由于Flash动画的背景颜色会遮盖掉背景图像，这样就看不到背景图像了。为使背景图像能够正常显示，只需将 Flash 动画的背景颜色改成透明即可。 步骤 1 在 Dreamweaver 中打开本项目素材“shop”文件夹中“index.html”文档。在网站标志所在单元格右侧的单元格中插入“\\shop\\\\images”文件夹中的动画文件“nihong.swf”。 步骤 2 保存文档，单击“文档”工具栏中的“在浏览器中预览/调试”按钮，在弹出的菜单中选择“预览在IExplore”菜单项，在浏览器中预览效果，可以发现Flash动画遮挡了表格的背景图像。 步骤 3 回到 Dreamweaver 操作界面。选中 Flash 动画，单击“属性”面板中的“参数”按钮，打开“参数”对话框。在“参数”列第一行单击，输入“wmode”，在对应的“值”列输入“transparent”，单击“确定”按钮，关闭“参数”对话框。 步骤 4 再次保存文档，并在浏览器中预览，可以看到动画后面的背景图像出现了。 （三）插入 Flash按钮 Flash 按钮包括两类，一类是用 Flash 软件制作的按钮，另一类是 Dreamweaver 中集成的 Flash 按钮。前者的插入方法与 Flash 动画类似，此处主要讲解后者的插入。 步骤 1 将插入点置于要插入Flash按钮的位置，选择“插入记录”→“媒体”→ “Flash 按钮”菜单，打开“插入 Flash 按钮”对话框。 步骤 2 在“样式”列表框中选择一种样式，其效果将显示在“范例”栏中，这里选择“Slider”；在“按钮文本”编辑框中输入要在按钮上显示的文本内容，此处为“company”；在“字体”下拉列表中选择一种字体，作为按钮文本的字体；在“大小”编辑框中设置按钮文本的大小；在“链接”编辑框中设置按钮的链接目标；在“目标”下拉列表中选择打开链接文档的方式，此处设置为“_self”。单击“确定”按钮，即可插入 Flash 按钮。 （四）插入音频文件 步骤 1 打开本项目素材“music”文件夹中的“wma.html”文档。将插入点置于网页中要插入音频文件的位置（此处为表格最下方的空白单元格），选择“插入记录”→“媒体”→“插件”菜单，打开“选择文件”对话框。 步骤 2 在“查找范围”下拉列表中选择文件所在位置（此处为“\\\\项目三\\\\music\\\\ music”文件夹），在文件列表中选择要插入的文件（此处为“ybzdgd.wma”），单击“确定”按钮，插入音频文件。 步骤 3 选中插入的音频文件，在“属性”面板中将“宽”和“高”分别改为 “280”和“45”，将“对齐方式”改为“居中”。 步骤 4 保存文档并在IE浏览器中预览。在音乐传来的同时，可以看到白色单元格中出现了 Windows Media Player 播放器的控制面板。 （五）插入视频文件 除音频文件外，在 Dreamweaver 中还可以插入视频文件、Shockwave 影片和 Applet等其他媒体元素。 步骤 1 打开本项目素材“video”站点中的“cat_a.html”文档。在“影片介绍”左侧的空白单元格中单击，然后选择“插入记录”→“媒体”→“插件”菜单，打开“选择文件”对话框。 步骤 2 选择要插入的视频文件（此处为“\\\\ 项目三 \\\\video\\\\images”文件夹中的“cat.mpeg”），单击“确定”按钮，即可插入视频。