制作多媒体网页.ppt

中文FrontPage2003教程,第九章制作多媒体网页,第一节Web组件的使用第二节DHTML效果的设置第三节在网页中插入多媒体文件第四节网页中的过渡效果第五节ActiveX控件和Java小程序,第一节Web组件的使用,一、插入字幕二、插入交互式按钮三、插入计数器四、插入包含内容五、网页横幅,一、插入滚动字幕,（1）在“网页”视图下打开Web页面，选择“插入”菜单中的“Web组件”命令，在图9-1所示的对话框中选择“插入Web组件”组件类型中的“字幕”，如图9-8所示。,（2）单击“完成”按钮，弹出如图9-9所示的对话框。单击“样式”按钮，弹出如图9-11所示的“修改样式”对话框。,（3）如果对滚动字幕的效果不满意时，可以修改滚动字幕的属性。方法有三种：单击字幕，然后再单击鼠标右键，在弹出的快捷菜单中选择“字幕属性”。直接双击字幕。选中字幕，然后按下AltEnter快捷键。另外，删除滚动字幕的方法非常简单，只需直接选中字幕组件，然后按下Delete键将其删除即可。,二、插入交互式按钮,（1）新建一个空白网页，单击“插入”菜单中的“Web组件”命令，弹出“插入Web组件”如图9-1所示的对话框。,（2）选择“动态效果”组件类型中的“交互式按钮”，单击“完成”按钮，弹出如图9-2所示的“交互式按钮”对话框。在对话框中，有“按钮”、“字体”和“图像”选项卡，分别用于对交互式按钮的属性设置。,三、插入站点计数器,（1）在“网页”视图下打开Web页面，选择“插入”菜单中的“Web组件”命令，在图9-1所示的对话框中选择“插入Web组件”组件类型中的“计数器”。（2）单击“完成”按钮，弹出如图9-32所示的对话框。用户可以在“计数器样式”的选项中选择一种喜欢的格式。,四、插入包含内容组件,1.替换2.网页3.预定网页4.预定图片5.网页横幅,1.替换,（1）在“网页”视图下打开Web页面，选择“插入”菜单中的“Web组件”命令，在图9-1所示的对话框中选择“插入Web组件”组件类型中的“包含内容”，在右边的列表框中选择“替换”，如图9-41所示。（2）单击“完成”按钮，即可弹出“替换属性”对话框。（3）单击“替换为”下拉框的下拉式按钮，选择要插入的变量名，然后单击“确定”按钮。,2.网页,（1）在“网页”视图下打开Web页面，选择“插入”菜单中的“Web组件”命令，在图9-1所示的对话框中选择“插入Web组件”组件类型中的“包含内容”，在右边的列表框中选择“网页”。（2）单击“完成”按钮，即可弹出“包含网页属性”对话框。,（3）输入当前Web的站点，或者单击“浏览”按钮，在弹出的“当前网站”对话框中选择一个网页，如图9-46所示。（4）单击“当前网站”对话框的“确定”按钮，然后再单击“包含网页属性”对话框中的“确定”按钮，即可将网页插入其中。,3.预定网页,（1）在“网页”视图下打开Web页面，选择“插入”菜单中的“Web组件”命令，在图9-1所示的对话框中选择“插入Web组件”组件类型中的“包含内容”，在右边的列表框中选择“预定网页”。（2）单击“完成”按钮。（3）需要填入“在预定的时间内”显示的网页的路径，和在“在预定的时间之前或之后（可选）”显示的网页路径，也可以单击文本框后的“浏览”按钮来选定网页。（4）在“开始时间”和“结束时间”后的各个下拉框中选择显示预定网页的开始时间和结束时间。,4.预定图片,（1）在“网页”视图下打开Web页面，选择“插入”菜单中的“Web组件”命令，在对话框中选择“插入Web组件”组件类型中的“包含内容”，在右边的列表框中选择“预定图片”。（2）单击“完成”按钮。（3）在对话框的最下面选择预定图片显示的开始时间和结束时间。（4）要显示的图片有两个输入文本框，分别是:“在预定的时间内”及“在预定的时间之前或者之后（可选）”文本框。,5.网页横幅,（1）在“网页”视图下打开Web页面，选择“插入”菜单中的“Web组件”命令，在对话框中选择“插入Web组件”组件类型中的“包含内容”，在右边的列表框中选择“网页横幅”。（2）单击“完成”按钮。得到“网页横幅属性”对话框。（3）在“网页横幅属性”对话框中填入文本内容。,第二节DHTML效果的设置,使用FrontPage2003提供的动态HTML效果可以使网页中的各种网页元素都具有动态效果。方法：“视图”工具栏”“DHTML效果”,打开“DHTML效果”工具栏。,一、在网页中插入音频文件1.添加背景音乐（1）新建一个空白网页，选择“格式”菜单中的“背景菜单项”，弹出如图3-34所示对话框：,第三节在网页中插入多媒体文件,（2）在“背景音乐”下“位置（C）”输入框旁边单击按钮，弹出如图3-35所示的对话框。,（3）选中需要作为背景音乐的音频文件，然后单击按钮，回到对话框，在“位置（C”）输入框中以显示所需的背景音乐名称，如图3-36所示。,（4）单击对话框的按钮，即可完成音频文件的插入。在“预览”视图下可以听到所插入的背景音乐。,2.使用插件,在网页中插入音频文件还可以通过插件来实现.方法：选“插入”/“Web组件”/“高级控件”，在右边选“插件”，弹出下面对话框,3.链接音频文件,选中文字右击，选“超链接”，在列表框选文件,二、在网页中插入视频文件,（1）新建一个空白网页，选择“插入”菜单中的“图片”菜单项，再选择“视频”子菜单项，弹出如图3-37所示的对话框。,（2）选择需要插入的视频文件，然后单击按钮，视频文件即可被插入至网页中。（3）选中视频文件，单击右键，在弹出的快捷菜单中选择“图片属性”命令，弹出如图3-38所示的对话框。（4）单击按钮，即可完成对视频文件的插入。,三、插入Flash影片,（1）新建一个空白网页，选择“插入”菜单中的“图片”菜单项，再选择“Flash影片”子菜单项，弹出如图3-39所示的对话框。,（2）选择选择需要插入的Flash文件，然后单击按钮，该Flash即可被插入至网页中。如图3-40所示。,（3）选中该Flash文件，然后单击鼠标右键，在弹出的快捷菜单中选择“Flash影片属性”，弹出如图3-41所示的对话框。,（4）完成设置后，单击对话框的按钮，即可完成对视频文件的插入。（5）保存该网页，然后使用IE或者其他浏览器可以看到该Flash影片的播放效果，如图3-43所示。,第四节网页中的过渡效果,方法：“格式”“网页过渡”注：FrontPage2003提供了25种过渡效果。,第五节ActiveX控件和Java小程序,在网页中插入控件和小程序,可使网页更具有活力一、ActiveX控件方法：选“插入”/“Web组件”/“高级控件”，在右边选“ActiveX”，弹出下面对话框,二、Java小程序,Java语言是一种面向对像的语言。Java小程序是通过Java语言开发出来的一种特殊程序。可在网页中播放声音、显示动画效果，但要发布后在浏览器中才看到效果。,第九章制作多媒体网页,本章重点:制作交互式按钮的方法制作滚动字幕的方法使用电子表格和图表制作站点计数器的方法如何插入图片库如何包含内容组件制作链接栏的方法制作目录的方法,第9章制作多媒体网页,9.1制作交互式按钮9.2制作滚动字幕9.3插入Web搜索9.4插入电子表格和图表9.5制作站点计数器9.6插入图片库9.9包含内容组件9.8制作链接栏9.9制作目录,9.3插入Web搜索,（1）在“网页”视图下打开Web页面，选择“插入”菜单中的“Web组件”命令，在图9-1所示的对话框中选择组件类型中的“Web搜索”，如图9-15所示，缺省情况下，搜索类型是“当前网站”。,9.3插入Web搜索,（2）单击“完成”按钮，弹出如图9-16所示的“搜索表单属性”对话框。“搜索表单属性”选项卡。“搜索结果”选项卡。,9.3插入Web搜索,（3）单击按钮，即可完成在网页中插入Web组件。如图9-18所示。,9.4插入电子表格和图表,9.4.1Office电子表格9.4.2Office电子图表9.4.3Office数据透视表9.4.4电子表格和图表的编辑,9.4.1Office电子表格,1）在“网页”视图下打开Web页面，选择“插入”菜单中的“Web组件”命令，在图9-1所示的对话框中选择“插入Web组件”组件类型中的“电子表格和图表”，在右边的列表框中选择“Office电子表格”，如图9-19所示。,9.4.1Office电子表格,（2）单击“完成”按钮，即可完成Office电子表格的插入。,9.4.2Office电子图表,（1）在“网页”视图下打开Web页面，选择“插入”菜单中的“Web组件”命令，在图9-1所示的对话框中选择“插入Web组件”组件类型中的“电子表格和图表”，在右边的列表框中选择“Office电子图表”。（2）单击“完成”按钮。,9.4.2Office电子图表,1.选择数据来源2.为数据类型设置明细,9.4.3Office数据透视表,（1）在“网页”视图下打开Web页面，选择“插入”菜单中的“Web组件”命令，在图9-1所示的对话框中选择“插入Web组件”组件类型中的“电子表格和图表”，在右边的列表框中选择“Office数据透视表”。（2）单击“完成”按钮，即可完成Office数据透视表的插入。,9.4.3Office数据透视表,（3）单击Office数据透视表中的“单击此处可连接数据”超链接，弹出如图9-28所示的对话框。在该对话框中，可以设置Office数据透视表的“数据源”、“特性”和“保护”属性。,9.4.4电子表格和图表的编辑,1.定位编辑单元格2.在表格中插入行/列3.插入电子表格的注意事项,9.6插入图片库,（1）在“网页”视图下打开Web页面，选择“插入”菜单中的“Web组件”命令，在图9-1所示的对话框中选择“插入Web组件”组件类型中的“图片库”，在右侧的列表框中可以选择图片在网页中的布局，也可以建立图片库后再调整。,9.6插入图片库,（2）单击“完成”按钮。（3）在该“图片库属性”对话框中单击“添加”按钮，在弹出的下拉菜单中选择“图片来自文件”，弹出“打开”对话框。（4）在“打开”对话框可以连续选取一系列图片，然后单击“打开”按钮，回到对话框。（5）可以对图片进行简单的编辑。选中一张图片的文件名之后，单击“编辑”按钮。,9.6插入图片库,（6）单击“编辑图片”对话框的“确定”按钮，回到“图片库属性”对话框，单击“布局”选项卡，可以进行图片显示的布局调整。如图9-39所示。（9）完成各项设置后，单击“完成”按钮完成设置。,9.8制作链接栏,9.8.1包含自定义链接的链接栏9.8.2包含“上一个”和“下一个”链接的链接栏9.8.3基于导航结构的链接栏,9.8.1包含自定义链接的链接栏,（1）在“网页”视图下打开Web页面，选择“插入”菜单中的“Web组件”命令，在图9-1所示的对话框中选择“插入Web组件”组件类型中的“链接栏”，在右边的列表框中选择“包含自定义链接的链接栏”。（2）单击“完成”按钮，单击“下一步”按钮，弹出如图9-56所示的对话框。,9.8.1包含自定义链接的链接栏,（3）在图9-56所示对话框中选择选择栏的样式。单击“下一步”按钮。弹出“插入Web组件”对话框。（4）单击“完成”按钮，弹出“插入新的链接栏”对话框。（5）在“插入新的链接栏”对话框中填入新的链接栏的名称。（6）单击“添加链接”按钮，添加一些链接，并单击“确定”按钮完成操作。,9.8.2包含“上一个”和“下一个”链接的链接栏,（1）在“网页”视图下打开Web页面，选择“插入”菜单中的“Web组件”命令，在图9-1所示的对话框中选择“插入Web组件”组件类型中的“链接栏”，在右边的列表框中选择“包含“上一个”和“下一个”链接的链接栏”。（2）单击“完成”按钮，单击“下一步”按钮，弹出如图9-56所示的对话框。,9.8.2包含“上一个”和“下一个”链接的链接栏,（3）单击“下一步”按钮，弹出“插入Web组件”对话框。（4）单击“完成”按钮，弹出“链接栏属性”对话框。（5）单击“确定”按钮，得到如图9-65所示的包含“上一个”和“下一个”链接的链接栏的网页。,9.8.3基于导航结构的链接栏,（1）在“网页”视图下打开Web页面，选择“插入”菜单中的“Web组件”命令，在图9-1所示的对话框中选择“插入Web组件”组件类型中的“链接栏”，在右边的列表框中选择“包含“上一个”和“下一个”链接的链接栏”。（2）单击“完成”按钮，单击“下一步”按钮，弹出“插入Web组件”对话框。,9.8.3基于导航结构的链接栏,（3）单击“下一步”按钮，弹出“插入Web组件”对话框。（4）单击“完成”按钮，弹出如图9-90所示的“链接栏属性”对话框。,9.9制作目录,9.9.1基于Web站点目录9.9.2基于网页类别目录,9.9.1基于Web站点目录,（1）在“网页”视图下打开Web页面，选择“插入”菜单中的“Web组件”命令，在图9-1所示的对话框中选择“插入Web组件”组件类型中的“目录”，在右边的列表框中选择“该网站”。（2）单击“完成”按钮，得到如图9-93所示的“目录属性”对话框。,9.9.2基于网页类别目录,（1）在“网页”视图下打开Web页面，选择“插入”菜单中的“Web组件”命令，在图9-1所示的对话框中选择“插入Web组件”组件类型中的“目录”，在右边的列表框中选择“基于网页类别”。（2）单击“完成”按钮，得到如图9-93所示的“类别属性”对话框。在该对话框中选择一个或几个类别。,9.9.2基于网页类别目录,（3）选择网页类别。网页类别可以在视图界面中设置。（4）选择复选框中的选项，并单击“确定”按钮完成操作。,9.10插入多媒体文件,1插入音频文件2插入视频文件3插