所谓图像映射 (image map) 就是被分成几个区域,或者被称之为“热区”的图像;点击“热区”会显示一个网页。使用 Image 面板可以进行图形化的图像映射创建,以及对客户端图像映射进行编辑。
客户端图像映射在 HTML 文档中存有超链接信息,不像服务器端图像映射是将其放到一个单独的映射文件中。当用户点击图像上的热区的时候,相关联的 URL 就会直接被送到服务器上。这就使得客户端的图像映射要比服务器端图像映射要快的多,这是因为当用户点击之后服务器不需要再进行解释。客户端图像映射可以被 Netscape Navigator 2.0 以上版本,NCSA Mosaic 2.1 和 3.0,以及所有版本的 Microsoft Internet Explorer。
Dreamweaver 并不改变现有文档中服务器端图像映射的备注。所以你可以在同一文档中同时使用客户端和服务器端图像映射。需要注意的是,同时支持两种类型图像映射的浏览器会优先选用客户端图像映射的。如果要在文档中包含服务器端图像映射,你必须亲自书写相关的 HTML 代码。
如何创建客户端图像映射:
1 | 选取图像。 |
2 | 点击属性面板右下角的扩展箭头可以查看图像所有的属性。 |
3 | 在 Map Name 域中输入映射名字。 |
注意:如果你在同一文档使用了多个图像映射,一定要给每个映射起个独特点的名字。 | |
4 | 要定义图像映射去,与执行下列操作之一: |
![]() |
选取画圆工具通过拖动鼠标滑过图像可以创建出圆形的热区。 |
![]() |
选取矩形工具通过拖动鼠标滑过图像可以创建出矩形的热区。 |
![]() |
选取多边形工具通过在每个角处点击一次的办法可以定义出一个不规则形状的热区。点击箭头工具可以封闭这个形状。 |
当热区被选中之后,Hotspot 面板会出现在属性面板之下。有关热区面板的介绍,参阅 设置热区属性。 | |
5 | 在 Hotspot 面板上点击文件夹图标查找点击热区要打开的文件,或者直接在 Link 域中输入文件的名字。 |
6 | 如果你不想让链接文档出现在当前窗口或者框架之内的话,在 Target 填框内输入一个窗口名字,或者从弹出菜单中选择一个框架。 |
参阅 创建链接。 | |
7 | 在 Alt 填框内,输入在文本浏览器中替换热区图像的替换文本。 |
有些浏览器会在用户将鼠标指针暂停在热区上时作为工具提示显示这段文本。 | |
8 | 重复步骤 4 到步骤 7 定义映射图上的其它热区。 |
![]() |
如何在图像映射上选取多个热区:
在图像被选取之后,执行下列操作之一:
![]() |
按住 Shift 键点击你要选取的其它热区 |
![]() |
敲击 Control+A (Windows) 或 Command+A (Macintosh) |
当你从一个文档向另一个文档拷贝图像的时候,与图像关联的热区也会被同时复制。
你可以使用箭头键或者鼠标一次移动一个或者多个热区。你也可以选择 Modify > Layers and Hotspots 对热区进行排列,将其放到前边或者后边,或者令其宽度和高度一致,如果有两个热区交叠在一起的话,第一个热区居于支配地位。