新网页设计与制作项目实训教程 教学课件 严加琼 曾金发 项目6.pptVIP

项目6 插入动感元素 随着多媒体技术的发展，网页已由最初单一的图片、文字内容发展为多种媒体集合的表现形式。在网页中应用多媒体技术，如音频、视频、Flash动画等内容，可以增强网页的表现效果，使网页更生动，激发访问者兴趣。本项目所制作的“山水江西”动感页面效果如图所示。 6.2.1 Flash文件类型概述 6.2.2 插入Flash对象 6.2.3 插入视频 6.2.4 插入音乐 6.2.1 Flash文件类型概述 Flash是网上流行的矢量动画技术，近几年很多站点都采用了Flash技术，把传统网页无法做到的效果准确表现出来，增强了网页的吸引力，如使用Flash制作的导航条、按钮动感十足。Dreamweaver中提供的Flash元素主要包括Flash动画、FlashPaper、Flash视频，它的扩展名为“.swf”。 6.2.2 插入Flash对象 插入Flash对象操作步骤如下： 1.将光标定位到插入动画的位置。 2.执行以下操作之一。 （1）单击菜单栏的“插入”→“媒体”→“SWF”（使用快捷键【Ctrl+Alt+F】），如图所示。 （2）单击对象面板上的“插入”图标，选中“常用”→“媒体：插件”→“SWF”，界面如图所示。 3．操作后会弹出 “选择SWF”对话框，如图所示（如果页面没有保存会出现图警告示意图，一般建议先把SWF文件和页面文件放在同一站点文件夹）。 4．在对话框中选择要插入的.SWF 文件，单击“确定”按钮。弹出“对象标签辅助功能属性”对话框，设置完成后，单击“确定”按钮。 5．插入FLASH文件后，在设计视图以FLASH图标方式显示，查看动画效果必须打开浏览器，Dreamweaver中界面如图所示。 6．选中Flash动画文件，可在属性面板中对属性进行设置。如图所示。 “背景颜色”选项：指定影片区域的背景颜色。 “编辑”按钮：单击编辑工具按钮可对Flash文件进行编辑。 “循环”选项：设置影片是否循环播放。一般是选中该复选框。 “自动播放”选项：设置影片在加载页面时是否自动播放。一般是选中该复选框。 “垂直边距”和“水平边距”选项：以像素为单位在影片的四周设置空白区域。 “品质”选项：设置影片在浏览器中的显示播放效果。 “比例”选项：有默认、无边框、严格匹配三种显示方式，一般选择默认方式。 “对齐”选项：设置影片在页面上的对齐方式。 “播放/停止”按钮：单击此按钮可在当前文档中直接播放影片,或者停止播放。 “参数”按钮：单击该按钮，可以打开一个对话框，对影片的播放参数进行设置。 6.2.3 插入视频 在网页中除了可插入Flash动画外，还可插入其它的视频，如*.mpg、*.avi、*.mov文件。操作步骤如下： （1）将光标移到要插入影片的位置，单击菜单“插入”→“媒体”→“插件”命令， （2）在“选择文件”对话框中，选择需要插入的视频文件，单击“确定”按钮。 （3）回到Dreamweaver窗口后，光标位置会出现视频插件图标，在“属性”面板的“宽”和“高”栏分别输入影片的宽度和高度，如图所示。 (4)选中视频插件图标，在属性面板中可以对播放器的属性进行设置。 (5)设置完成后，保存按下F12键，即可预览播放视频。 6.2.4 插入音乐 1. 插入音频文件 在网页中插入音频时，考虑到下载速度、声音效果等因素，一般采用MIDI或mp3格式的音频。在网页中插入音频文件后，系统自动生成默认的播放器。操作步骤如下： （1）将光标移到要插入音乐文件的位置，然后选择“插入”面板的“常用”模式，在“媒体”中单击 插件外挂程序按钮。 （2）在打开的“选择文件”对话框中选择音乐文件。 （3）回到Dreamweaver窗口后，光标位置会出现音乐插件图标。 （4）选中插件图标，在属性面板中可以对播放器的属性进行设置，如图所示。 （5）在属性面板中，单击“参数”按钮，出现“参数” 对话框后，在“参数”栏输入hidden，并在“值”栏输入false，接着单击“+”按钮新增设置项目，在“参数”栏输入autostart，在“值”栏输入true，最后单击“确定”按钮，如图所示。 （6）按下F12键，打开浏览器预览，在页面中实现了嵌入音乐的效果，在浏览器里显示了播放插件，如图所示。 提示：hidden参数用来设置是否隐藏播放器面板，autostart参数则是设置是否自动开始播放。 2.添加背景音乐 声音能极好的烘托网页页面的氛围，网页中常见的声音格式有WAV、MP3、MIDI、AIF、RA、或Real Audio格式。 在页面中可以嵌入背景音乐。这种音乐多以MP3文件为主，在Dreamweaver CS5中，添加背景音乐可以通过代码实现。 在HTML语言中，通过bgsoun