当前位置:文档之家› 多媒体对象的使用

多媒体对象的使用

第5章多媒体对象的使用本章要点:●声音与视频的使用●Flash动画使用●Shockwave电影的使用●Java特效的使用本章难点:●如何在网页中使用各种多媒体对象多媒体网页制作主要是在网页中使用各种多媒体对象,包括:使用声音和视频、使用Flash动画、使用Java特效和使用Shockwave电影等。

通过这些对象为浏览者提供在网上听音乐和观看视频的功能,使网页具有更丰富的感官和视觉效果。

5.1声音与视频的使用5.1.1添加背景音乐背景音乐通常是给浏览者以美妙视听感觉,以此提高吸引力,并为网页增色添彩,从而体现个性的一种手段。

在网页中插入背景音乐的格式可以是.wav、.mid和.mp3等,这些格式的文件一般浏览器都支持。

但由于受到网络带宽的限制,绝大多数情况下背景音乐一般采用.mid格式。

同时由于背景音乐并不是一种标准的网页属性,它需要通过修改源代码的方式进行添加。

其操作步骤如下:(1)打开要添加背景音乐的网页,切换到代码视图。

(2)在头文件<head>和</head>之间添加以下代码:<bgsound src=“背景音乐的URL”loop=“循环次数”>,如图5.1所示。

网页设计与制作添加此段代码图5.1 修改源代码添加背景音乐标记符Bgsound的基本属性是src,用于指定背景音乐的源文件。

而常用属性loop则用于指定背景音乐重复的次数,若不指定该属性,则背景音乐将无限循环。

(3)按【F12】键,在浏览器窗口中浏览背景音乐的效果。

5.1.2链接声音与视频1、声音概述声音是最常见的一种多媒体信息。

它可以是一段动听的音乐,也可以是为一个按钮或文字链接设置的音效。

用户可以指定点击播放按钮时播放的音乐,或者当鼠标移入一个文字链接上方时播放的音效。

但声音文件播放是受浏览器限制的。

常用IE浏览器支持Wav、Mid音乐的播放。

其他格式的声音文件需要安装相应插件才能播放。

例如QuickTime、Windows Media Player或RealPlayer。

声音文件格式有多种,常用的主要有Mid、Wav、Mp3格式等。

.mid或.midi(乐器数字接口)格式用于器乐。

许多浏览器都支持MIDI文件,且不要求插件。

MID格式的文件量较小,品质却很高,但不能录制,只能有专业声音编辑软件制作。

.wav(Waveform 扩展名)格式文件具有较好的声音品质,许多浏览器都支持此类格式文件,且不要求插件。

它可以从CD、磁盘或麦克风等录制WAV文件。

但是,WAV文件通常很大,在网上播放时受到一定的限制。

.mp3(MPEG-音频层-3)格式是一种压缩格式,它可令声音文件明显缩小。

其声音品质非常好,如果正确录制和压缩MP3文件,其质量甚至可以和CD质量相媲美。

这一新技术可以对文件进行“流式处理”,以便访问者不必等待整个文件下载完成即可收听该文件。

但是,其文件大小要大于Real Audio文件,因此通过普通电话线连接下载整首歌曲可能要花较长的时间。

若要播放MP3文件,访问者必须下载安装相应插件或播放器。

第5章多媒体对象的使用2、视频概述视频是信息含量最丰富的一种媒体。

可以通过不同方式和使用不同格式将视频添加到Web页面。

视频可直接下载给用户,或者对视频进行流式处理以便在下载的同时播放它。

如果想要包括可被下载而不是被流式处理的简短剪辑,则可以链接到该剪辑或将该剪辑嵌入到页面中。

视频文件的主要格式有AVI格式、MPEG格式和MOV格式等。

AVI格式的视频可以具有非常高的品质,但文件量较大。

MPEG格式是VCD所采用的格式,文件量较小,效果不如AVI格式。

MOV格式是QuickTime专用格式,品质和文件大小都比较理想,但需要专门的QuickTime播放器。

3、链接声音与视频链接声音与视频是指将声音与视频添加到Web页面的一种方式。

这种集成声音与视频文件的方法可以使访问者能够选择他们是否要收听或收看该文件,并且使文件用于最大区域范围的观众。

若系统中没有安装能够播放相应格式文件的播放器,那么则进行文件下载。

建立指向某一声音或视频文件的链接,其操作步骤为:(1)选择要用作超链接的文本或图像。

(2)在“属性检查器”中,单击“链接”文本框后的“浏览文件”按钮,选择站点中的音频文件或视频文件(文件名称必须是英文,不能插入汉字名称的文件)。

例5-1对某一图像文件链接声音文件:Highway Blues。

操作方法:启动Dreamweaver软件,选择“插入”菜单中的“图像”命令,打开“选择图像源”对话框,选取某一图像文件。

然后选定该图像,在“属性检查器”中,单击“链接”文本框后的“浏览文件”按钮,选择声音文件:Highway Blues。

图5.2左边所示为链接了声音文件的图像文档,右边所示为按【F12】键后,在浏览器窗口中单击链接声音文件的图像后,播放链接声音文件的窗口。

图5.2 链接声音文件5.1.3嵌入声音与视频网页设计与制作若确定安装有能播放相应格式文件的插件(例如RealMedia或QuickTime插件),则可通过嵌入方式将声音与视频文件直接插入页面中。

建立嵌入声音或视频文件,其操作步骤为:(1)在文档窗口中,将插入点定位到要嵌入文件的地方,然后在“插入”栏的“媒体”选项卡中单击“插件”图标。

(2)在“选择文件”对话框中选择嵌入的音频文件或视频文件(文件名称必须是英文,不能插入汉字名称的文件)。

(3) 通过在“高”和“宽”文本框中输入数值或者通过在“文档”窗口中拖动调整插件占位符的大小,可以确定播放器控件在浏览器中的显示大小。

例5-2在网页中嵌入某一声音文件。

操作方法:启动Dreamweaver软件,单击“插入”→“媒体”→“插件”命令,打开“选择文件”对话框,选择要嵌入的音频文件write。

在“属性检查器”中调整插件占位符的高度和宽度,以确定播放器控件在浏览器中的显示大小。

图5.2左边所示为嵌入声音文件的文档窗口,右边所示为按【F12】键后,在浏览器窗口中预览的效果。

图5.3 在网页中嵌入音频Write文件5.2 使用 flash动画flash动画是目前最流行的web多媒体技术,已越来越广泛应用于网络环境中,成为传递图片和声音的主要手段之一。

一般浏览器都支持flash动画播放。

本节主要介绍如何在网页中插入Dreamweaver提供的flash动画和插入已有的flash动画。

5.2.1插入Dreamweaver提供的Flash 动画1、插入Flash按钮Dreamweaver提供的Flash按钮是根据鼠标指针位置、状态的不同,显示不同的图像;且在鼠标单击时实现超链接的动作。

其插入Flash按钮的步骤为:(1)在“插入”栏的“媒体”面板中单击“Flash按钮”按钮,打开“插入Flash按钮”对话框。

如图5.4所示。

第5章多媒体对象的使用图5.4 插入“Flash按钮”对话框(2) 在打开的对话框中设置:在“样式”列表中选择一种按钮样式;在“按钮文本”文本框中输入按钮文字;在“字体”和“大小”框中选择按钮文字的字体和字号;在“链接”文本框为按钮设置超链接;在“目标”下拉列表框指定超链接目标框架;在“背景色”框选择一种按钮背景色;在“另存为”文本框输入按钮的保存文件名。

(3) 设置完成单击“确定”按钮。

单击属性面板上的“播放”按钮可查看Flash按钮效果,也可以按【F12】键在浏览器窗口中预览网页。

小结:若设置的按钮超链接后无法正确跳转,可先将按钮删除,然后用“插入Flash”的方式重新插入Flash按钮文件(文件已保存在站点中)。

2.、插入Flash文本Dreamweaver能使用户创建并插入纯文字的Flash电影,称为Flash文本。

其文本文件量很小,且文字的效果很好。

其插入Flash文本的步骤为:(1) 在“插入”栏的“媒体”面板中单击“Flash文本”按钮,打开“插入Flash文本”对话框。

如图5.5所示。

网页设计与制作图5.5 插入“Flash文本”对话框(2) 在打开的对话框中设置:在“字体”和“大小”框内设置字体与字号;可以单击下面的文字样式与段落对齐按钮,设置文本格式;在“颜色”和“转滚颜色”框设置文字原始颜色与转滚颜色;在“文本”文本框内输入文字内容;可在“链接”文本框内设置超链接;可在“目标”下拉列表框指定超链接目标框架;在“背景色”框指定文字的背景颜色;在“另存为”文本框设置Flash文本的保存文件名。

(3) 设置完成单击“确定”按钮。

单击属性面板上的“播放”按钮,将鼠标移动到文字上即可查看Flash文本效果,也可以按【F12】键在浏览器窗口中预览。

5.2.2插入已有的flash动画Dreamweaver中可方便快捷地插入flash动画,而在网上播放的flash动画是Swf格式的,它是经过压缩优化的一种视频格式,具有较高品质和丰富动画效果。

所以在插入flash动画前必须将制作的flash动画导出为.swf后缀的文件格式。

在网页中插入flash动画的步骤为:(1)在“插入”拦的“常用”选项卡中单击“flash”按钮,或者在“插入”栏的“媒体”选项卡中单击“flash”按钮,此时出现“选择文件”对话框,定位到要插入的Flash 文件(必须是.swf文件),然后单击“确认”按钮。

(2) 窗口中出现占位图形,此时Flash动画在文档中不可见,以占位图形表示。

若要查看动画效果,可以单击占位符选中它,然后在“属性检查器”中单击“播放”按钮,也可以按【F12】键在浏览器窗口中预览。

例5-3在网页中插入flash动画heyjude。

操作方法:启动Dreamweaver软件,执行菜单“插入”→“媒体”→“flash”命令,打开“选择文件”的对话框,选取要插入的flash动画。

例如本图的heyjude。

Swf,完成后如图5.6所示。

第5章多媒体对象的使用图5.6 在页面中插入flash动画若需要在Dreamweaver中预览flash动画,可以点击“属性检查器”中的“播放”按钮。

如图5.7所示。

若想要用浏览器查看最终的效果,按【F12】键即可。

图5.7 在Dreamweaver中预览flash动画小结:若要在文档中修改Flash动画的大小,可在“属性检查器”的“宽度”框和“高度”框内输入数值,也可以直接在文档窗口中,选取动画后拖拽控制点改变动画的尺寸。

5.3 使用Shockwave电影Shockwave电影也是一种常见的多媒体对象。

本节主要介绍Shockwave电影的概述以及如何使用该对象的方法。

5.3.1什么是Shockwave电影网页设计与制作Shockwave电影是Macromedia网上交互多媒体的标准,是一种允许用Macromedia 的Director软件创建的媒体文件能够快速下载并能被大多数流行的浏览器播放的压缩格式。

相关主题