7多媒体网页.ppt
文本预览下载声明
* * (2)选择apDiv1,打开【行为】面板,单击【添加行为】按钮 ,在弹出的菜单中选择【显示—隐藏元素】动作,打开【显示—隐藏元素】对话框,如图所示。 * (3)在“元素”列表框中选择div“apDiv2”,然后单击下面的 按钮,单击 按钮,在行为面板中选择事件为“onMouseOver”,如图所示。 * (4)重复(2)(3)步骤,在“元素”列表框中选择div“apDiv2”,然后单击下面的 按钮,单击 按钮,在行为面板中选择事件为“onMouseOut”,如图所示。 * (5)保存文件,按F12键在浏览器中观看网页效果,鼠标经过apDiv1中的“显示效果”对象上时显示apDiv2中的“汽车”内容,产生隐现效果,如图所示。 * 7.2.5 情境5 转到URL 【转到URL】行为动作可在当前窗口或指定的框架中打开一个新页。此行为适用于通过一次单击更改两个或多个框架的内容。 【转到URL】行为的制作步骤如下: (1)在文档中选择要添加行为的图像,打开行为面板,单击【添加行为】按钮 ,在弹出的菜单中选择【转到URL】动作,如下图所示。 * * (2)打开【转到URL】对话框,在URL文本框中输入要转到的URL“”,如图所示。 * (3)单击 按钮,在行为面板中看到添加的动作。可以将事件设置为“onMouseMove”,如图所示。 * (4)保存网页文档,按F12键浏览,当光标在添加了行为的图像上移动时,就会转到指定的URL,如图所示。 * 7.2.6 情境6 设置状态栏文本 使用【设置状态栏文本】行为动作可以浏览器窗口底部左侧的状态栏中显示消息。例如:可以使用此动作在状态栏中显示链接的目标。 【设置状态栏文本】行为的制作步骤如下: (1)打开行为面板,单击 【添加行为】按钮 ,在弹出的菜单中选择【设置文本】→【设置状态栏文本】动作,如下图所示。 * * (2)打开【设置状态栏文本】对话框,在“消息”文本框中输入要显示的文字或相应的JavaScript代码,如图所示。 * (3)单击 按钮,即可完成行为添加。保存网页文档,按F12键在浏览器中预览效果,如图所示。 * 7.3 任务3 创建网站相册 相册与人们的生活密切相关,它可以用来收集、查看照片。在制作个人网站时,用户也可以把自己的电子相册放到网页中去。用Dreamweaver CS4制作相册的优点主要是可以设置更多的选项,页面制作得更漂亮。 在制作相册前,首先要确保计算机中安装有Fireworks图像处理软件,Dreamweaver CS4需要调用它来处理图片。 制作电子相册的操作步骤如下: (1)新建一个用来存放图片的文件夹images,再建立final文件夹用来存放生成的html文件。 * (2)将所要放到相册中的图片保存到images文件夹中。 (3)运行Dreamweaver CS4,执行【文件】→【新建】菜单命令,新建一个空白页面,专门用来存放电子相册。 (4)执行【命令】→【创建网站相册】菜单命令,弹出【创建网站相册】对话框,输入生成的网页标题,在【源图像文件夹】中输入images文件夹路径,在【目标文件夹】中输入final文件夹路径,如下图所示。 * * (5)设置完成后单击 按钮,系统自动调用Fireworks,完成相册主页的创建过程。 (6)单击 按钮,将弹出相册的页面。 (7)可以使用CSS样式表来美化相册,在【新建CSS规则】对话框中设置参数如图所示,新建一个table标签的CSS样式来修饰表格的边框。 * (8)单击 后,弹出【table的CSS规则定义】对话框,在“分类”列表中选择“边框”,设置表格边框的样式、宽度、颜色,如图所示。 * (9)再新建一个单元格td标签的CSS样式,参数设置如图所示。 * (10)单元格的类型与边框参数设置。类型中设置文字为白色;边框中设置样式为实线(solid)、宽度(width)为1px、颜色(color)为灰色。如图所示。 * (11)单元格的扩展参数设置如图所示。在“过滤器”栏中输入Glow所需要的参数(Color=green,strength=5),然后单击 按钮。 * (13)按F12键预览,打开浏览器窗口后,即可看到发光的文字与边框,如图所示。 * 7.5 小结 本项目介绍了在网页中插入各种媒体文件、行为特效的使用、网站相册的创建以及使用CCS样式美化相册的方法和技巧。通过本项目的学习,让读者掌握各种多媒体元素的灵活运用,丰富自己的网页,使网站变得更加生动起来。
显示全部