3.2 多媒体在网页中的应用

在网页中除了使用文本和图像元素表达信息外，用户还可以向其中插入 Flash 动画、Java Applet小程序、Activex控件等多媒体，以丰富网页的内容。虽然这些多媒体对象能够使网页更加丰富多彩，吸引更多的浏览者，但是有时必须以牺牲浏览速度和兼容性为代价。所以，一般网站为了保证浏览者的浏览速度，不会大量运用多媒体元素。

命令介绍

插入Flash动画：Dreamweaver CS6提供了使用Flash对象的功能，虽然Flash中使用的文件类型有Flash 源文件（.fla）、Flash SWF文件（.swf）、Flash 模板文件（.swt），但Dreamweaver CS6只支持Flash SWF（.swf）文件，因为它是Flash源文件（.fla）的压缩版本，已进行了优化，便于在 Web 上查看。

插入Flash文本：Flash 文本是指只包含文本的 Flash 影片。Flash 文本使用户利用自己选择的设计字体创建较小的矢量图形影片。

3.2.1 课堂案例——物流运输网页

【案例学习目标】使用“插入”面板“媒体”选项卡插入Flash动画，使网页变得生动有趣。

【案例知识要点】使用“Flash SWF”按钮，为网页文档插入Flash动画效果；使用“播放”按钮在文档窗口中预览效果，如图3-18所示。

【效果所在位置】Ch03/效果/物流运输网页/index.html。

（1）选择“文件 > 打开”命令，在弹出的“打开”对话框中，选择本书学习资源中的“Ch03 > 素材 > 物流运输网页 > index.html”文件，单击“打开”按钮打开文件，如图 3-19 所示。将光标置入到如图3-20所示的单元格中。

（2）单击“插入”面板“常用”选项卡中的“SWF”按钮，在弹出的“选择SWF”对话框中，选择本书学习资源中的“Ch03 > 素材 > 物流运输网页 > images > DH.swf”文件，如图3-21所示。单击“确定”按钮，弹出“对象标签辅助功能属性”对话框，如图3-22所示，这里不需要设置，直接单击“确定”按钮，完成动画的插入，效果如图3-23所示。

（3）选中插入的 Flash 动画，单击“属性”面板中的“播放”按钮，在文档窗口中预览效果，如图3-24所示。可以单击“属性”面板中的“停止”按钮，停止播放动画。

（4）保存文档，按F12键预览效果，如图3-25所示。

3.2.2 插入Flash动画

Dreamweaver CS6 提供了使用 Flash 对象的功能，虽然 Flash 中使用的文件类型有 Flash 源文件(.fla)、Flash SWF文件(.swf)、Flash 模板文件(.swt)，但Dreamweaver CS6只支持Flash SWF(.swf)文件，因为它是 Flash (.fla) 文件的压缩版本，已进行了优化，便于在 Web 上查看。

在网页中插入Flash动画的具体操作步骤如下。

（1）在文档窗口的“设计”视图中，将插入点放置在想要插入影片的位置。

（2）通过以下几种方法启用“Flash”命令。

① 单击“插入”面板“常用”选项卡中的“媒体”展开式按钮，选择“SWF”选项。

② 选择“插入 > 媒体 > SWF”命令。

③ 按Ctrl+Alt+F组合键。

（3）弹出“选择SWF”对话框，选择一个后缀为“.swf”的文件，如图3-26所示，单击“确定”按钮完成设置。此时，Flash占位符出现在文档窗口中，如图3-27所示。

（4）选中文档窗口中的 Flash 对象，在“属性”面板中单击“播放”按钮，测试播放效果。

3.2.3 插入FLV

在网页中可以轻松添加FLV视频，而无须使用Flash创作工具。但在操作之前必须有一个经过编码的 FLV 文件。使用Dreamweaver插入一个显示FLV文件的SWF组件，当在浏览器中查看时，此组件显示所选的FLV文件以及一组播放控件。

Dreamweaver 提供了以下选项，用于将FLV视频传送给站点访问者。

“累进式下载视频”选项：将FLV文件下载到站点访问者的硬盘上，然后进行播放。但是，与传统的“下载并播放”视频传送方法不同，累进式下载允许在下载完成之前就开始播放视频文件。

“流视频”选项：对视频内容进行流式处理，并在一段可确保流畅播放的很短的缓冲时间后在网页上播放该内容。若要在网页上启用流视频，必须具有访问Adobe®Flash®Media Server的权限，必须有一个经过编码的 FLV 文件，然后才能在Dreamweaver中使用它。可以插入使用以下两种编解码器（压缩/解压缩技术）创建的视频文件：Sorenson Squeeze 和 On2。

与常规SWF文件一样，在插入FLV文件时，Dreamweaver将插入检测用户是否拥有可查看视频的正确Flash Player版本的代码。如果用户没有正确的版本，则页面将显示替代内容，提示用户下载最新版本的Flash Player。

提示

若要查看 FLV 文件，用户的计算机上必须安装 Flash Player 8 或更高版本。如果用户没有安装所需的 Flash Player 版本，但安装了 Flash Player 6.0 r65 或更高版本，则浏览器将显示 Flash Player快速安装程序，而非替代内容。如果用户拒绝快速安装，则页面会显示替代内容。

插入FLV对象的具体操作步骤如下。

（1）在文档窗口的“设计”视图中，将插入点放置在想要插入FLV的位置。

（2）通过以下几种方法，弹出“插入FLV”对话框，如图3-28所示。

① 单击“插入”面板“常用”选项卡中的“媒体”展开式按钮，选择“FLV”选项。

② 选择“插入 > 媒体 > FLV”命令。

设置累进式下载视频的选项作用如下。

“URL”选项：指定FLV文件的相对路径或绝对路径。若要指定相对路径（如mypath/myvideo.flv），则单击“浏览”按钮，导航到FLV文件并将其选定。若要指定绝对路径，则输入FLV文件的URL（如http://www.example.com/myvideo.flv）。

“外观”选项：指定视频组件的外观。所选外观的预览会显示在“外观”弹出菜单的下方。

“宽度”选项：以像素为单位指定FLV文件的宽度。若要让Dreamweaver确定FLV文件的准确宽度，则单击“检测大小”按钮。如果Dreamweaver无法确定宽度，则必须输入宽度值。

“高度”选项：以像素为单位指定FLV文件的高度。若要让Dreamweaver确定FLV文件的准确高度，则单击“检测大小”按钮。如果Dreamweaver无法确定高度，则必须输入高度值。

提示

“包括外观”是 FLV 文件的宽度和高度与所选外观的宽度和高度相加得出的和。

“限制高宽比”复选框：保持视频组件的宽度和高度之间的比例不变。默认情况下会选择此选项。

“自动播放”复选框：指定在页面打开时是否播放视频。

“自动重新播放”复选框：指定播放控件在视频播放完之后是否返回起始位置。

设置流视频选项的作用如下。

“服务器URI”选项：以rtmp://www.example.com/app_name/instance_name的形式指定服务器名称、应用程序名称和实例名称。

“流名称”选项：指定想要播放的FLV文件的名称（如myvideo.flv）。扩展名.flv是可选的。

“实时视频输入”复选框：指定视频内容是否是实时的。如果选择了“实时视频输入”，则Flash Player将播放从Flash® Media Server流入的实时视频流。实时视频输入的名称是在“流名称”文本框中指定的名称。

提示

如果选择了“实时视频输入”，组件的外观上只会显示音量控件，因为您无法操纵实时视频。此外，“自动播放”和“自动重新播放”选项也不起作用。

“缓冲时间”选项：指定在视频开始播放之前进行缓冲处理所需的时间（以秒为单位）。默认的缓冲时间设置为0，这样在单击了“播放”按钮后视频会立即开始播放。（如果选择“自动播放”，则在建立与服务器的连接后视频立即开始播放）如果要发送的视频的比特率高于站点访问者的连接速度，或者Internet通信可能会导致带宽或连接问题，则可能需要设置缓冲时间。例如，如果要在网页播放视频之前将15s的视频发送到网页，请将缓冲时间设置为15。

（3）在对话框中根据需要进行设置。单击“应用”或“确定”按钮，将FLV插入到文档窗口中，此时，FLV占位符出现在文档窗口中，如图3-29所示。

3.2.4 插入Shockwave影片

Shockwave 是 Web 上用于交互式多媒体的 Macromedia 标准，是一种经过压缩的格式，使在Macromedia Director 中创建的多媒体文件能够被快速下载，而且可以在大多数常用浏览器中进行播放。

在网页中插入Shockwave影片的具体操作步骤如下。

（1）在文档窗口的“设计”视图中，将插入点放置在想要插入Shockwave影片的位置。

（2）通过以下几种方法启用“Shockwave”命令。

① 在“插入”面板“常用”选项卡中，单击“媒体”展开式工具按钮，选择“Shockwave”选项。

② 选择“插入 > 媒体 > Shockwave”命令。

（3）在弹出的“选择文件”对话框中选择一个影片文件，如图3-30所示，单击“确定”按钮完成设置。此时，Shockwave影片的占位符出现在文档窗口中，选择文档窗口中的Shockwave影片占位符，在“属性”面板中修改“宽”和“高”的值，来设置影片的宽度和高度。保存文档，按F12键预览效果，如图3-31所示。

3.2.5 插入ActiveX控件

ActiveX 控件，也称OLE控件。它是可以充当浏览器插件的可重复使用的组件，有些像微型的应用程序。ActiveX控件只在Windows系统上的Internet Explorer中运行。Dreamweaver CS6中的ActiveX对象可为浏览者的浏览器中的 ActiveX 控件提供属性和参数。

在网页中插入ActiveX 控件的具体操作步骤如下。

（1）在文档窗口的“设计”视图中，将插入点放置在想要插入ActiveX 控件的位置。

（2）通过以下几种方法启用“Active X”命令，插入ActiveX 控件。

① 在“插入”面板“常用”选项卡中，单击“媒体”展开式工具按钮，选择“ActiveX”选项。

② 选择“插入 > 媒体 > ActiveX”命令。

（3）选中文档窗口中的ActiveX 控件，在“属性”面板中，单击“播放”按钮测试效果。