创建 rollover 图像

Rollover 图像是指当游标“滚”过图像的时候图像会发生变化。创建 rollover 图像的方法是向图像添加 behavior。

所谓的 behavior 就是事件 (event) 和动作 (action) 的组合。 事件是触发 action 的情形。例如， 一个被称之为 onClick 的事件在用户点击按钮的时候就发生了，或者一个被称之为 onMouseOver 的事件当鼠标游标滑过(或称作"滚过")对象的时候发生。Actions (动作)是为了执行特定任务，如打开浏览器窗，播放声音，或者停播 Shockwave 影像，而预写的一段 JavaScript 代码。

在向页面元素添加 behavior 的时候，你要同时指定 action 和触发它的事件。Dreamweaver 已经在程序中位用户提供了一些常用的预制 actions 供使用。

在这一部分里，你将要应用 Swap Image (交换图像) actions 到 Our Story， Products 和 This Week 图像，这样当鼠标滑过这些图像的时候(也就是当 onMouseOver 事件发生时)它们会被加亮。 例如，当 Our Story 图像正常出现在页面上时应当是这样的：

在定义了包含 Swap Image action 和 onMouseOver 事件的 behavior 后，当鼠标滑过 Our Story 图像时它看上去是这样的：

然后你还要继续在主页上为导航图添加 behaviors。完成后就可以在浏览器中预览并测试这些 behaviors。

1	在文档窗，点击选取 Our Story 图像。
2	选择 Window > Behaviors 或者按 F8 打开 Behavior 面板，上边列有所有定义被选元素的 behaviors。
3	在 Events For 弹出菜单中 3.0 and Later Browsers 因该已经显示。如果未显示，选取它。
4	要添加新的 action 到列表，只要点击加号 (+) 按钮，选择 Swap Image。
	弹出 Swap Image 对话框，在 Images 列表上，你将会看到页面上所有的图像，选取 Our Story。这只是原始图，它将在鼠标滑过的时候被另一幅图像替换。
5	点击 Browse，找到 Scaal_site/Images 文件夹，选取 btn_ourstory_over.gif 文件，然后点击 Select (Windows) 或 Choose (Macintosh) 选取图像。
	这幅图像将在 onMouseOver 事件发生时替换原始图像。
6	接受预载和恢复图像的默认设置。
	Preload Images 选项是用来在页面下载的时候先将交换图像下载到浏览器的缓存里， 这样当用户一将鼠标滑过 Our Story 图像，在替换图形出来之前不会出现明显的停滞。
	Restore Images onMouseOut 选项能够自动为这幅图像指定 Swap Image Restore action 和 onMouseOut 事件。这样当用户将鼠标移开交换图像时图像就会恢复到原始图像。
7	点击 OK 关闭 Swap Image 对话框，将新的变化应用到页面中。
	Behavior 面板上现在就包括了刚才你为图像定义的事件和 actions。onMouseOver 事件对应 Swap Image action；onMouseOut 事件对应 Swap Image Restore action (这一 behavior 之所以被定义是因为你在 Swap Image 对话框中接受了默认选项)。
8	重复 4 到 7，继续给 Products 和 This Week 图像添加 Swap Image actions 和 onMouseOver 事件：
	选取 Products 图像，然后在弹出的 Swap Image 对话框中设置交换图像为 btn_products_over.gif。
	选取 This Week 图像，然后在 Swap Image 对话框中设置交换图像为 btn_thisweek_over.gif。
9	关闭 Behavior 面板。
10	按 F12 在默认浏览器中查看文档。
	在预览文档之前没必要先保存文档。预览文档的时候所有的与浏览器有关的功能都会正常工作的。
11	移动鼠标游标到 Our Story，Products，和 This Week 图像上查看变化。
12	完成预览后，关闭浏览器。
13	返回到 Dreamweaver，选择 File > Save，保存文档。

接下来你要开始创建主页所链接的文件了。